常见数组方法的总结

会改变原数组的方法

经过整理，我们发现 Array 原型中可以改变数组自身内容的方法有 7 个，分别是 push、pop、shift、unshift、splice、sort和 reverse

push/unshift/pop/shift/

push返回值是push后的数组长度

var arr = [0, 1, 2]
console.log(arr.push(3) // 4; 返回值是push后数组的长度
console.log(arr) // [0, 1, 2, 3]; 会改变原数组

unshift返回值是unshift后数组的长度

var arr = [1, 2, 3]
console.log(arr.unshift(0)) // 4; 返回值是unshift后数组的长度
console.log(arr) // [0, 1, 2, 3]; 会改变原数组

pop返回值是pop出来的元素

var arr = [1, 2, 0]
console.log(arr.pop()) // 0; 返回值是pop出来的元素
console.log(arr) // [1, 2]; 会改变原数组

shift返回值是shift出来的元素

var arr = [1, 2, 3]
console.log(arr.shift()) // 1; 返回值是shift出来的元素
console.log(arr) // [2, 3]; 会改变原数组

splice

// 删除
var arr = [1, 2, 3]
var newArr = arr.splice(1, 1)
console.log(newArr) // [2] // 返回值是包含splice删除元素的新数组
console.log(arr) // [1, 3] // 会改变原数组
// newArr 与 arr 是不同的两个数组

// 增加
var arr = [1, 2, 3]
console.log(arr.splice(1, 0, 4, 4)) // []
console.log(arr) // [1, 4, 4, 2, 3]

reverse

var arr = [1, 2, 3]
var newArr = arr.reverse() 
console.log(newArr) // [3, 2, 1] // 返回值是reverse翻转后的原数组
console.log(arr) // [3, 2, 1] // 会改变原数组
// newArr 与 arr 指向同一个数组

sort

var arr = [1, 4, 3, 2]
var newArr = arr.sort((a, b) => a - b)
console.log(newArr) // [1, 2, 3, 4]; 返回值是sort排序后的原数组
console.log(arr) // [1, 2, 3, 4]; 会改变原数组
// newArr 与 arr 指向同一个数组

不会改变原数组的方法

slice

var arr = [1, 2, 3]
var newArr = arr.slice(0, 2)
console.log(newArr) // [1, 2]; 返回值是slice切片后的新数组
console.log(arr) // [1, 2, 3]; 不会改变原数组
// newArr 与 arr 是不同的两个数组

concat

var arr = [1, 2, 3]
var newArr = arr.concat([4]) 
console.log(newArr) // [1, 2, 3, 4]; 返回值是concat合并后的新数组
console.log(arr) // [1, 2, 3]; 不会改变原数组
// newArr 与 arr 是不同的两个数组

forEach/map/filter

forEach 对数组中的每一项运行给定函数，该方法没有返回值，并且不会改变原数组

arr.forEach(function callback(currentValue[, index[, array]]) {
 // some operate
}[, thisArg])

map对数组中的每一项运行给定函数，返回数组每一项map映射之后的值组成的新数组，并且不会改变原数组

var new_array = arr.map(function callback(currentValue[, index[, array]]) {
 // Return element for new_array 
}[, thisArg])

filter对数组中的每一项运行给定函数，返回数组中通过filter过滤函数结果为ture的项组成的新数组，并且不会改变原数组

var newArray = arr.filter(function callback(currentValue[, index[, array]]) {
 // Return 
}[, thisArg])

reduce

reduce返回的是reduce归并后汇总成的单个值，并且不会改变原数组

arr.reduce(function callback(accumulator, currentValue[, index[, array]]) {
 // 
}[, initialValue])

参数

accumulator

累计器累计回调的返回值; 它是上一次调用回调时返回的累积值，或initialValue

currentValue

数组中正在处理的元素

index（可选）

数组中正在处理的当前元素的索引。 如果提供了initialValue，则起始索引号为0，否则从索引1起始

array（可选)

调用 reduce() 的数组

注意

回调函数第一次执行时，accumulator 和currentValue的取值有两种情况：如果调用reduce()时提供了initialValue，accumulator取值为initialValue，currentValue取数组中的第一个值；如果没有提供 initialValue，那么accumulator取数组中的第一个值，currentValue取数组中的第二个值。

var arr = [1, 2, 3]
var reducer = function (accumulator, currentValue) {
    return accumulator + currentValue
}
var res = arr.reduce(reducer)
console.log(res) // 6; 返回值是reduce归并后的结果
var res = arr.reduce(reducer, 5) // 11;
console.log(arr) // [1, 2, 3]; 不会改变原数组