【再学前端】Es6 数组新增方法

[Samgao0312]

JavsScript Array 对象： https://www.runoob.com/jsref/jsref-obj-array.html

1、 Array.forEach()

循环遍历数组中的每一项

let arr = [1, 2, 3];
arr.forEach((item, index, array) => {
// 数组操作
// 不能return 值
console.log(item, index);
console.log(array)
});

2、Array.map()

map方法 和 forEach每次执行匿名函数都支持3个参数，参数分别是: item（当前每一项）、index（索引值）、arr（原数组），但是map返回一个新数组，原数组不影响。

let arr = [1, 2, 3];
let arr2 = arr.map((item, index, array) => {
if (item > 1) {
return item;
} else {
return false; // 通过return 返回想要的东西
}
});
console.log('arr: ', arr)  //arr:  [ 1, 2, 3 ]
console.log('arr2', arr2)  //arr2 [ false, 2, 3 ]

## 3、[Array.filter()](https://www.runoob.com/jsref/jsref-filter.html)
> 筛选数组中符合条件的项，返回一个新数组
```js
let arr = [1, 2, 4];
let result = arr.filter((item, index) => {
  return item > 2;
});
console.log(arr) //原数组不变
console.log(result) //[ 4 ]

4、Array.find()

find() 方法只会找到第一个符合的，找到之后就会直接返回，就算下面还有符合要求的，也不会再找下去;

let arr = [1, 1, 2, 4];
let result = arr.find((item, index, array) => {
return item >= 2;
});
console.log(arr); //原数组不变, [ 1, 1, 2, 4 ]
console.log(result); //返回符合条件的第一个数组项

5、Array.findIndex()

• 描述： 返回符合传入测试（函数）条件的数组元素索引。

  let arr = [1, 1, 2, 4];
  let result = arr.findIndex((item, index, array) => {
  return item > 2;
  });
  console.log(arr); //原数组不变, [ 1, 1, 2, 4 ]
  console.log(result); //返回符合条件的第一个数组项的索引

6、Array.reduce()

• 描述： 计算数组元素相加后的总和。
• 语法： array.reduce(function(total, currentValue, currentIndex, arr) {}, initialValue) 注意： 第二个参数 initialValue 可选，如果不传的话，第一个函数参数中的total == item， 即为每次循环项；

  // 求数组项之和
  var nums = [65, 44, 12, 4];
  function getSum(total, num) {
  return total + num;
  }
  let result = nums.reduce((total, curValue, curIndex, arr) => {
  return total + curValue;
  }, 0)
  console.log(result); //125

  // 求数组最大值
  let arry = [52, 52, 45, 100, 99, 63];
  let max = arry.reduce((prev, item) => Math.max(prev, item))
  console.log(max);  //100

// 数组去重
let arry = [52, 52, 45, 100, 99, 63, 45];
let newArry = arry.reduce((prev, item) => {
  prev.indexOf(item) == -1 && prev.push(item);
  return prev;
}, []);
console.log(newArry);

let arr = [
  {name:'张三', index:0}, 
  {name:'李四', index:1}
];
let result = arr.reduce((total, item, index, arr) => {
  total.push(item.name);
  return total;
}, [])
console.log(result) //[ '张三', '李四' ]

7、Array.some()

• 描述 some()方法用于检测数组中的元素是否有满足条件的，只要有一个满足就返回true，否则返回false；

  let arr = [1, 2, 4];
  let result = arr.some((item, index) => {
  return item > 2;
  });
  console.log(result)  // true

8、Array.every()

• 描述： 检测数组中的元素是否都满足条件函数；
• 语法： array.every(function(currentValue,index,arr), thisValue)

  let arr = [1, 2, 4];
  let result = arr.every((item, index) => {
  return item > 2;
  });
  console.log(result) // false

9、Array.of()

将一组值转变为数组，参数不分类型，只分数量，数量为0返回空数组。

Array.of()  //[]
Array.of('')  //['']
Array.of('hello world')  //['hello world']

10、Array.from()

描述： 用于将类似数组的对象和可遍历对象转为真正的数组。

let json = {
0: '11',
1: '22',
2: '33',
length: 3,
};
let arr = Array.from(json);
console.log(arr); // ["11", "22", "33"]

let arr = Array.from(new Set([1, 2, 1, 2]))
console.log(arr) //[1, 2]

11、Array.includes()

• 描述： includes() 方法用来判断一个数组是否包含一个指定的值，如果是返回true，否则false。

  let site = ['runoob', 'google', 'taobao'];
  console.log(site.includes('runoob'));  //true
  console.log(site.includes('baidu'));  //false

12、 Array.copyWithin()

• 描述： copyWithin() 方法用于从数组的指定位置拷贝元素到数组的另一个指定位置中。会覆盖原有成员；
• 语法： array.copyWithin(target, start, end)

  
  var fruits = ["Banana", "Orange", "Apple", "Mango"];
  fruits.copyWithin(2, 0); 
  console.log(fruits)  //[ 'Banana', 'Orange', 'Banana', 'Orange' ]

var fruits = ["Banana", "Orange", "Apple", "Mango", "Kiwi", "Papaya"]; fruits.copyWithin(2, 0, 2); //Banana,Orange,Banana,Orange,Kiwi,Papaya

## 13、[Array.fill()](https://www.runoob.com/jsref/jsref-fill.html)

## 14、entries()，keys() 和 values()