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()