数组的方法总结

1.ES5的方法

1. Array.isArray(obj)
   用于确定传递的值是否是一个 Array。
   优于 instanceof,因为Array.isArray能检测iframes。

console.log(Array.isArray()); //false
console.log(Array.isArray([])); //true
console.log(Array.isArray(Array.prototype));  //true

2. arr.forEach 遍历数组

[1, 2, 3].forEach((value, index, item) => {
  console.log(value); //1 2 3
})

3. arr.map

[1, 2, 3].map(item => item*2); //循环每一项 都*2 >> [2, 4, 6]

4. arr.filter

[1, 2, 3].filter(item => item != 2);  // 删除为2 的 返回true留下 >> [ 1, 3 ]

5. arr.every

[1, 2, 3, 4].every(item => item == 1);  // 看看有没有不等于1的 有的话返回false >> false

6. arr.some

[1, 2, 3, 4].some(item => item == 5); // 看看有没有等于5的 有的话返回true >> false

7. arr.reduce(callback[, initialValue])
   对数组中的每个元素执行一个由您提供的reducer函数(升序执行)，将其结果汇总为单个返回值。

// 收敛 
let res = [1, 2, 3].reduce((acc, cur, ind) => {
  return acc + cur
})
console.log(res) //6
let res2 = [{c: 1}, {c: 2}, {c: 3}].reduce((acc, cur, ind) => acc + cur.c, 0)
console.log(res2) //6

8. arr.reduceRight()

var res = [[0, 1], [2, 3], [4, 5]].reduceRight((a, b) => a.concat(b), []);
console.log(res)  //[4, 5, 2, 3, 0, 1]

9. arr.splice(start[, deleteCount[, item1[, item2[, ...]]]]) 添加、删除、替换数组成员

const arr = [1, 2, 3, 4, 5, 6, 7, 8];
const arr1 = arr.splice(5);
console.log(arr, arr1) // [ 1, 2, 3, 4, 5 ] [ 6, 7, 8 ]
const arr2 = arr.splice(2, 1);
console.log(arr, arr2) // [ 1, 2, 4, 5 ] [ 3 ]
const arr3 = arr.splice(1, 1, 5, 5, 5)
console.log(arr, arr3) // [ 1, 5, 5, 5, 4, 5 ] [2]

10. arr.slice([begin[, end]]) 截取数组

console.log([1, 2, 3, 4].slice(1))  //[ 2, 3, 4 ]
console.log([1, 2, 3, 4].slice(-1))  //[ 4 ]
console.log([1, 2, 3, 4].slice(1, 2))  //[ 2 ]

11. 其他一些方法

//arr.pop
console.log([1, 2, 3].pop()) //3
//arr.push
const arrB = [1, 2, 3];
console.log(arrB.push(4, 5), arrB) // 5 (length),  [1, 2, 3, 4, 5]
//arr.shift
console.log([1, 2, 3].shift()) //1
//arr.unshift
const arrF = [1, 2, 3];
console.log(arrF.unshift(4, 5), arrF)  // 5 (length),  [ 4, 5, 1, 2, 3 ]

// arr.indexOf
console.log([1, 2, 3].indexOf(2, 1))  //1
// arr.lastIndexOf
console.log([1, 2, 3, 1].lastIndexOf(1))  //3

// arr.concat()
let arr = [1, 2];
let newArr = arr.concat([3, 4]);
console.log(arr, newArr);  //[ 1, 2 ] [ 1, 2, 3, 4 ]

// arr.join
console.log([1, 2, 3].join('')) // '123'
console.log([1, 2, 3].join()) // '1,2,3'

//arr.reverse()
const arr = [1, 2, 3, 4];
console.log(arr, arr.reverse())
//[ 4, 3, 2, 1 ] [ 4, 3, 2, 1 ]

//arr.sort()
const arr = [{index: 3}, {index: 1}, {index: 2}];
console.log(arr.sort((a, b) => b.index - a.index))
//[ { index: 3 }, { index: 2 }, { index: 1 } ]

2.ES6新增方法

1. Array.from(arrayLike[, mapFn[, thisArg]])
   从一个类似数组或可迭代对象创建一个新的，浅拷贝的数组实例
   任何有length属性的对象，都可以通过Array.from方法转为数组，而此时扩展运算符就无法转换。

console.log(Array.from([1, 2, 3], x => x + x)); //[ 2, 4, 6 ]
console.log(Array.from(new Set(['foo', 'bar', 'baz', 'foo'])));  //[ 'foo', 'bar', 'baz' ]
console.log(Array.from({ length: 3 })); //[ undefined, undefined, undefined ]

2. Array.of(element0[, element1[, ...[, elementN]]])
   用于将一组值，转换为数组。基本上可以用来替代Array()或new Array()

console.log(Array.of());    //[]
console.log(Array.of(1, 2));  //[ 1, 2 ]
console.log(Array.of(undefined)); //[ undefined ]

3. arr.keys(), arr.values(), arr.entries()

for (let index of ['a', 'b'].keys()) {
  console.log(index); //0, 1
}
for (let elem of ['a', 'b'].values()) {
  console.log(elem);  //'a', 'b'
}
for (let [index, elem] of ['a', 'b'].entries()) {
  console.log(index, elem); //0 'a', 1 'b'
}

4. arr.find, arr.findIndex
   返回数组中满足提供的测试函数的第一个元素的值(索引)

const array = [5, 12, 8, 130, 44];
console.log(array.find(element => element > 10));    //12
console.log(array.findIndex(element => element > 10));   //1

5. arr.copyWithin(target[, start[, end]])
   浅复制数组的一部分到同一数组中的另一个位置，并返回它，不会改变原数组的长度。

console.log([1, 2, 3, 4, 5].copyWithin(0, 3)) //[ 4, 5, 3, 4, 5 ]
console.log([1, 2, 3, 4, 5].copyWithin(0, 3, 4)) //[ 4, 2, 3, 4, 5 ]
console.log([1, 2, 3, 4, 5].copyWithin(-1, 1, 2)) //[ 1, 2, 3, 4, 2 ]

6. arr.includes(valueToFind[, fromIndex])
   用来判断一个数组是否包含一个指定的值 (ES2016)

console.log([1, 2, 3].includes(2))  //true
console.log([1, 2, 3].includes(2, 2))  //false
console.log([1, 2, 3].includes(1, -2))  //false
// 从 3 (arr.length) + -2 (fromIndex) 起始往后搜索

7. arr.flat([depth])
   会按照一个可指定的深度递归遍历数组，并将所有元素与遍历到的子数组中的元素合并为一个新数组返回。 (ES2019)

[1, 2, [3, [4, 5]]].flat()
// [1, 2, 3, [4, 5]]
[1, 2, [3, [4, 5]]].flat(2)
// [1, 2, 3, 4, 5]
[1, [2, [3]]].flat(Infinity)
// [1, 2, 3]

8. arr.flatMap(callback)
   首先使用映射函数映射每个元素，然后将结果压缩成一个新数组。(草稿阶段)

[2, 3, 4].flatMap((x) => [x, x * 2])  // [2, 4, 3, 6, 4, 8]
// 相当于 [[2, 4], [3, 6], [4, 8]].flat()

参考 developer.mozilla.org/zh-CN/docs/…