ES6新增的数组方法：到你的收藏夹吃灰吧

js用户库扩展最多特性之一的就是数组，ES6 为 Array 新增加一些静态方法和原型方法

1、迭代遍历方法

1.1 forEach()

 array.forEach(function(value, [index], [arr]))

传入一个函数，函数参数依次为 value 、 index 、 arr

• value ：数组当前项的值（ 必填 ）
• index ：数组当前项的索引（ 可选 ）
• arr ：数组对象本身（ 可选，一般不选 ）

 let arr = [1, 2, 3, 4]
 var sum = 0
 arr.forEach(function(value, index) {
     sum += value
 console.log(sum);  // 10

1.2 map()

map() 和 forEach() 的区别就是 map() 会返回一个新数组

 let arr = [1, 2, 3, 4]
 var newArr = arr.map(function(value, index) {
     return value * 2
 console.log(newArr); // [ 2, 4, 6, 8 ]

1.3 filter()

filter() 方法主要用于筛选数组，会创建一个新的数组

 array.filter(function(value, [index], [arr]))

新方法中的元素是通过指定数组中符合条件的所有元素

• value ：数组当前的值
• index ：数组当前的索引
• arr ：数组对象本身（一般省略不写）

 let arr = [1, 2, 3, 4]
 var newArr = arr.filter(function(value, index) {
     return value % 2 == 0
 console.log(newArr); // [ 2, 4]

1.4 some()

some() 方法用于检测数组中的元素是否满足指定条件，通俗一点 查找数组中是否有满足条件的元素

 array.some(function(value, [index], [arr]) {})

注意：

• 返回值是布尔值 ，如果查找到满足条件的，返回 true ；否则返回 false
• 找打第一个满足条件的元素之后，终止循环，不再查找

 let




    
 arr = [1, 2, 3, 4]
 var newArr = arr.some(function(value, index) {
     return value % 2 == 0
 console.log(newArr); // true

1.5 every()

类似 some() ，但是需要全部满足才会返回 true

 let arr = [1, 2, 3, 4]
 var newArr = arr.every(function(value, index) {
     return value % 2 == 0
 console.log(newArr); // false

总结：

• filter() ：返回满足条件的元素，生成一个新数组
• some() ：查找是否有满足条件的元素，有则返回 true ；没有则返回 false
• every() ：检查是否所有元素均满足条件，是则返回 true ；否则返回 false

2、实例方法

2.1 find()

用于找出第一个满足条件的成员，如果找到了就返回该成员，否则返回 undefined

语法：

 arr.find(function(value, key) {});

栗子：

 let arr = [1, 2, 3, 4]
 // 只获取第一个符合条件的对象
 var value = arr.find(function(value, index) {
     return value % 2 == 0
 console.log(value); // 2

2.2 findIndex()

findIndex() 用于找出 第一个符合条件的数组成员的位置 ，如果没有找到返回 -1

语法与 find() 一样

 let arr = [1, 2, 3, 4]
 var index = arr.findIndex(function(value, index) {
     return value % 2 == 0
 console.log(index); // 1
 let arr = [1, 2, 3, 4, 2]
 console.log(arr.includes(2, 2)); // true

2.3 reduce()

reduce() ：对数组中的每个元素进行累加，返回一个新的值，可以传入初始值

 arr.reduce(function(tmp, value, [index]) {},  [startValue])

• tmp ： 上一次的累加值，初始值为外部传进去的初始值 startValue ，若没传默认是数组第一个值
• value ：数组元素；若累加值 tmp 为数组第一个值，则 value 为从数组第二个值开始
• index ：数组索引（可选）
• startValue ：外部传入的初始值（可选）

 let arr = [1, 2, 3, 4]
 let result = arr.reduce(function(tmp, value, index) {
     // 返回数组元素的和 tmp的初始值为10
     return tmp + value
 }, 10)
 console.log(result);  // 20

不传初始值

 let arr = [1, 2, 3, 4]
 let result = arr.reduce(function(tmp, value, index) {
     // tmp的初始值为数组第一个值 1，之后就是累加
     console.log(tmp);  // 1 3 6
     // index 和 value 从数组第二个值开始
     console.log(index + ':' + value);  // 1:2 2:3 3:4
     return tmp + value
 console.log(result); // 20

reduce() 更像是递归函数，我们来看一下计算数组平均值

 let arr = [1, 2, 3, 4]
 let result = arr.reduce(function(tmp, value, index) {
     // 当不是最后一个数的时候，进行元素累加
     if (index != arr.length - 1) {
         return tmp + value
             // 进行最后一个元素累加的时候
     } else {
         // 此时value为4
         return (tmp + value) / arr.length
 console.log(result); // 2.5

2.4 fill()

fill() 静态填充数组，即 用一个元素填充数组，被填充的数组元素都是一样的

 arr.fill(value, startIndex, [endStart]);

1. value ：要填充的值
2. startIndex ：开始填充的数组位置（ 必选 ）
3. endIndex ：结束填充的数组位置（ 不包括该位置 ， 可选）

 let arr = [1, 2, 3, 4]
 arr.fill('张三', 1, 3)
 console.log(arr);  // [ 1, '张三', '张三', 4 ]

2.5 includes()

表示某个数组是否包含给定的值，返回布尔值

 arr.includes(value, [startIndex]);

1. arr ：表示数组
2. value ：表示要判断的元素
3. startIndex ：开始查找的元素位置（可选）

  let arr = [1, 2, 3, 4, 2]
  // 从索引值为2的地方开始查找
  console.log(arr.includes(2, 2)); // true

2.6 copyWithin()

copyWithin() 复制数组中的一系列元素到该数组的某个起始位置

注意：复制的一系列元素会代替数组原位置的元素，数组的长度依旧是不变的

 arr.copyWithin(index, startIndex, [endIndex])

1. index ：要粘贴到数组的某个位置
2. startIndex ：复制数组元素的起始位置
3. endStart ：结束数组的元素位置（ 不包括该位置 ，可选）

 let arr1 = [1, 2, 30, 40, 50];
 // 从第3个开始复制
 arr1.copyWithin(0, 2);
 console.log(arr1); // [30, 40, 50, 40, 50]

3、静态方法

3.1 Array.of()

根据传入的参数创建数组

 let arr = Array.of(1, 2, 3, 4)
 console.log(); // [ 1, 2, 3, 4 ]
 // 可用于复制数组
 let arr = [1, 2, 3, 4]
 let newArr = Array.of(...arr)
 console.log(newArr);

3.2 Array.from()

将伪数组或可遍历对象转换为真正的数组

 Array.from(arrLike, [function]);

1. arrLike ： 接收伪数组或可遍历对象
2. [function] ： 接收一个参数，对元素进行处理后再放入数组中 （可选）

 // 将字符串转换为数组
 let arr = Array.from('zxc')
 console.log(arr); // [ 'z', 'x', 'c' ]