博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
JavaScript数组API汇总
阅读量:7041 次
发布时间:2019-06-28

本文共 7274 字,大约阅读时间需要 24 分钟。

01、push():将value添加到数组的最后,返回新数组的长度(改变原数组)

// Baselet a = [1, 2, 3, 4, 5]let result = a.push(1)console.log(result)    // 6console.log(a)         // [1, 2, 3, 4, 5, 1]// Moreresult = a.push('a', 'b')      // 可一次添加多个值console.log(result)            // 8console.log(a)                 // [1, 2, 3, 4, 5, 1, 'a', 'b']复制代码

02、unshift():添加元素到数组的开头,返回新数组的长度(改变原数组)

// Baselet a = [1, 2, 3, 4, 5]let result = a.unshift(1)console.log(result)        // 6console.log(a)             // [1, 1, 2, 3, 4, 5]// Moreresult = a.unshift('a', 'b')  // 可一次添加多个值console.log(result)           // 8console.log(a)                // ['a', 'b', 1, 1, 2, 3, 4, 5]复制代码

03、pop():删除数组中最后一个元素,返回被删除的元素(改变原数组)

// Baselet a = [5]let result = a.pop()console.log(result)  // 5console.log(a)       // []// Moreresult = a.pop()     // 数组为空数组后,执行pop()方法,返回undefinedconsole.log(result)  // undefinedconsole.log(a)       // []复制代码

04、shift():删除数组第一个元素,返回被删除的元素(改变原数组)

// Baselet a = [5]let result = a.shift()console.log(result)  // 5console.log(a)       // []// Moreresult = a.shift()     // 数组为空数组后,执行pop()方法,返回undefinedconsole.log(result)    // undefinedconsole.log(a)         // []复制代码

05、join(value):将数组用value连接为字符串,返回被连接后的字符串(不改变原数组)

// Baselet a = [1, 2, 3, 4, 5]let result = a.join()console.log(result)   // 1,2,3,4,5result = a.join('')console.log(result)   // 12345result = a.join(',')console.log(result)   // 1,2,3,4,5result = a.join('&')console.log(result)   // 1&2&3&4&5// Morelet obj = {    toString: function () {        console.log('调用了toString()方法!')        return 'a'    },    toValue: function () {        console.log('调用了toValue()方法!')        return 'b'    }}result = a.join(obj)  // 使用对象时会调用对象自身的toString方法,我们这里重写了toString// 调用了toString()方法console.log(result)  // 1a2a3a4a5console.log(a)       // [1, 2, 3, 4, 5]// 数组中的join()方法相对的一个方法是字符串的split()方法console.log(result.split('a'))  // [1, 2, 3, 4, 5]复制代码

06、reverse():反转数组,返回反转后的新数组(改变原数组)

// Baselet a = [1, 2, ,3, ,4, 5]let result = a.reverse()console.log(result)   //  [5, 4 ,3 ,2 ,1]console.log(a)        //  [5, 4 ,3 ,2 ,1]// Morea = [1, [2, 3], [4, 5]]result = a.reverse()console.log(result)   // [[4, 5], [2, 3], 1]console.log(a)        // [[4, 5], [2, 3], 1]// 可以看到这里的反转只是基于数组的第一层,属于浅反转// 一个简单的深反转需要使用递归实现const deepReverse = (array) => {  let temp = array.reverse()  temp.forEach(v => {    if (Object.prototype.toString.call(v) === '[object Array]') {      deepReverse(v)    }  })  return temp}a = [1, [2, 3], [4, 5]]result = deepReverse(a)console.log(result)  // [[5, 4], [3, 2], 1]复制代码

07、slice(start, end):获取子数组,包含原数组索引start的值到索引end的值,不包含end,返回获取的子数组(不改变原数组)

// Baselet a = [1, 2, 3, 4, 5]let result = a.slice(2, 4)console.log(result)  // [3, 4]console.log(a)       // [1, 2, 3, 4, 5]// Moreconsole.log(a.slice(1))       // [2, 3, 4, 5]  只有一个参数且不小于0时,则从此索引开始截取到数组的末尾console.log(a.slice(-1))      // [5]  只有一个参数且小于0时,则从倒数|start|位截取到数组的末尾console.log(a.slice(-1, 1))   // []   反向截取,不合法,返回空数组console.log(a.slice(1, -1))   // [2, 3, 4]  从第1位截取到倒数第1位console.log(a.slice(-1, -2))  // []   反向截取,不合法,返回空数组console.log(a.slice(-2, -1))  // [4]  倒数第2位截取到倒数第1位复制代码

08、splice(index, count, value1, value2....):从索引位index处删除count个元素,插入value1, value2等元素,返回被删除的元素组成的新数组(改变原数组)

// Baselet a = [1, 2, 3, 4, 5]let result = a.splice(1, 2, 0)console.log(result)  // [2, 3]console.log(a)  // [1, 0, 4, 5]// Morea = [1, 2, 3, 4, 5]console.log(a.splice(-2))  // [4, 5]  当参数为单个且小于0时,将截取从倒数|index|位到数组的末尾console.log(a)             // [1, 2, 3]a = [1, 2, 3, 4, 5]console.log(a.splice(-1))  // [5]  当参数为单个且小于0时,将截取从倒数|index|位到数组的末尾console.log(a)             // [1, 2, 3, 4]a = [1, 2, 3, 4, 5]console.log(a.splice(0))  // [1, 2, 3, 4, 5] 当参数为单个且不小于0时,将截取从index位到数组的末尾console.log(a)            // []a = [1, 2, 3, 4, 5]console.log(a.splice(1))  // [2, 3, 4, 5]  当参数为单个且不小于0时,将截取从index位到数组的末尾console.log(a)            // [1]a = [1, 2, 3, 4, 5]console.log(a.splice(-1, 2))   // [5]  从倒数第1位开始截取两个元素console.log(a)                 // [1, 2, 3, 4]a = [1, 2, 3, 4, 5]console.log(a.splice(0, 2, 'a', 'b', 'c'))  // [1, 2]console.log(a)  // ['a', 'b', 'c', 3, 4, 5]  截取后将value值依次填充到截取位置处,旧值被向后顺移复制代码

09、sort():对数组元素进行排序,返回排序后的新数组(改变原数组)

// Baselet a = [31, 22, 27, 1, 9]let result = a.sort()console.log(result)  // [1, 22, 27, 31, 9]console.log(a)  // [1, 22, 27, 31, 9]// Morea = ['c', 'ac', 'ab', 'A1', '1c', 13, 12, '13', '12', '3', '2', '1b', '1a', 1, 'aa', 'a', 3, 'b', 2]a.sort()console.log(a) // [1, 12, "12", 13, "13", "1a", "1b", "1c", "2", 2, "3", 3, "A1", "a", "aa", "ab", "ac", "b", "c"]// 可以看出sort排序是根据每个字符对应的ASCII码值进行排序的,而非值的大小。// 先比较第一位的ASCII码值,如果第一位的ASCII码值相同,则开始比较第二位的ASCII码值,以此类推// ASCII码表(http://tool.oschina.net/commons?type=4 + K)a = [31, 22, 27, 1, 9]a.sort((a, b) => {  return a - b})console.log(a)  // [1, 9, 22, 27, 31]  按数值大小正序排列a = [31, 22, 27, 1, 9]a.sort((a, b) => {  return b - a})console.log(a)  // [31, 27, 22, 9, 1]  按数值大小倒序排列复制代码

10、toString():将数组中的元素用逗号拼接成字符串,返回拼接后的字符串(不改变原数组)

// Baselet a = [1, 2, 3, 4, 5]let result = a.toString()console.log(result)  // 1,2,3,4,5console.log(a)  // [1, 2, 3, 4, 5]// 除了toString()方法之外,String()方法也可以将数组转换成字符串result = String(a)console.log(result)  // 1,2,3,4,5复制代码

11、indexOf(value):从索引为0开始,检查数组中是否包含有value,有则返回匹配到的第一个索引,没有则返回-1(不改变原数组)

// Baselet a = [1, 2, 3, 4, 5]let result = a.indexOf(2)console.log(result)  // 1console.log(a)  // [1, 2, 3, 4, 5]result = a.indexOf(6)console.log(result)  // -1console.log(a)  // [1, 2, 3, 4, 5]复制代码

12、lastIndexOf(value):从最后的索引开始,检查数组找那个是否包含value,有则返回匹配到的第一个索引,没有返回-1(不改变原数组)

// Baselet a = [1, 2, 3, 2, 5]let result = a.lastIndexOf(2)console.log(result)  // 3console.log(a)  // [1, 2, 3, 4, 5]result = a.lastIndexOf(6)console.log(result)  // -1console.log(a)  // [1, 2, 3, 4, 5]复制代码

13、concat(value):将数组和(或)值连接成新数组,返回新数组(不改变原数组)

// Baselet a = [1, 2], b = [3, 4], c = 5let result = a.concat(b, c)console.log(result)  // [1, 2, 3, 4, 5]console.log(a)  // [1, 2]// Moreb = [3, [4]]result = a.concat(b, c) console.log(result)  // [1, 2, 3, [4], 5]  concat对于嵌套数组无法拉平console.log(a)  // [1, 2]复制代码

14、forEach():对数组进行遍历循环,对数组中每一项运行给定函数,参数都是function类型,默认有传参,参数分别为:遍历数组内容、对应的数组索引、数组本身。没有返回值

var arr = [1, 2, 3, 4, 5]arr.forEach(function (item, index, a) {  console.log(item + '|' + index + '|' + (a === true))})// 输出为:// 1|0|true// 2|1|true// 3|2|true// 4|3|true// 5|4|true复制代码

15、map():指“映射”,对数组中的每一项运行给定函数,返回每次函数调用的结果组成的新数组

var arr = [1, 2, 3, 4, 5]var arr1 = arr.map(function (item, index, a) {  return item * item})console.log(arr1)  // [1, 4, 9, 16, 25]复制代码

16、filter():“过滤”功能,数组中的每一项运行给定函数,返回满足过滤条件组成的数组

var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]var arr1 = arr.filter(function (item, index, a) {  return index % 3 === 0 || item >= 8})console.log(arr1)  // [1, 4, 7, 8, 9, 10]复制代码

17、every():判断数组中每一项都是否满足条件,只有所有项都满足条件,才会返回true

var arr = [1, 2, 3, 4, 5]var arr1 = arr.every(function (item, index, a) {  return item < 10})console.log(arr1)  // truevar arr2 = arr.every(function (item, index, a) {  return item < 3})console.log(arr2)  // false复制代码

18、some():判断数组中是否存在满足条件的项,只要有一项满足条件,就会返回true

var arr = [1, 2, 3, 4, 5]var arr1 = arr.some(function (item, index, a) {  return item < 3})console.log(arr1)  // truevar arr2 = arr.some(function (item, index, a) {  return item < 1})console.log(arr2)  // false复制代码

综上可知,改变原数组的API如下:

  • push()、unshift()、pop()、shift()、reverse()、splice()、sort()

转载地址:http://sxxal.baihongyu.com/

你可能感兴趣的文章
算法设计与分析 上机题Mergesort
查看>>
WinForm 清空界面控件值的小技巧
查看>>
jQuery源码-dom操作之jQuery.fn.html
查看>>
IOS bug之Code Sign error:Provisioning profile
查看>>
Win10系统菜单打不开问题的解决,难道是Win10的一个Bug ?
查看>>
Xcode连接git@osc
查看>>
【Oracle】Current online Redo 和 Undo 损坏的处理方法
查看>>
TLTagsControl
查看>>
Linux内核中SPI总线驱动分析
查看>>
Java8中CAS的增强
查看>>
C语言之将无符号字符型转化为ascii码值
查看>>
maven2完全使用手册
查看>>
SQL应用与开发:(一)导论和环境
查看>>
简单封装quartz实现任务调度的配置和管理
查看>>
Android Matrix详解
查看>>
JVM 堆栈区域数据存放流程
查看>>
【MyBatis框架】配置文件-resultMap总结
查看>>
JSP生成验证码
查看>>
浏览器的窗口位置和大小
查看>>
Path实现常见toolbar点击弹出菜单效果
查看>>