es6中对数组进行遍历的方法有哪些？区别是什么？

1、for … of ：改变原数组

ES6引入了for...of循环，作为遍历所有数据结构的统一方法，包括：数组，Set和Map结构，某些类似数组的对象（比如arguments\DOM NodeList对象）、Generator对象，字符串

let arr = ['red', 'green', 'blue'];
for (let i of arr) {
  console.log(i);  // red green blue
}
// 遍历数组的键值
for (let i of arr.values()) {
  console.log(i);  // red green blue
}
// 遍历数组的键名
for (let i of arr.keys()) {
  console.log(i);  // 0 1 2
}
// 遍历数组的键名和键值
for (let [index, item] of arr.entries()) {
  console.log(index); // 0 1 2
  console.log(item);  // red green blue
  console.log(index + 1); // 1 2 3    得到的键名为数字形式
}

for...of循环读取键值，这与for...in有所不同，for...in循环读取键名，

for (let i in arr) {
  console.log(i); // 0 1 2
  console.log(i + 1);// 01 11 21      得到的键名为字符形式
}

2、 for… in

for…in 语句用于遍历数组或者对象的属性（对数组或者对象的属性进行循环操作）, 这种方法不仅数组本身元素将被遍历到，那些由用户添加的附加元素也将被遍历到，甚至连数组原型中的属性也将被遍历到。甚至在某些情况下，上面代码将会以任意顺序去遍历数组元素。

Array.prototype.add = function() {
   console.log('yellow');
 }
let arr = new Array('red', 'green', 'blue')
  for (let i of arr) {
   console.log(i);  //  red green blue
 }
 for (let i in arr) {
   console.log(i);  // 0 1 2 add
 }

for…in是用于遍历包含键值对(key-value)的对象，对数组并不是那么友好

3、forEach：改变原数组

• 数组名.forEach（function（数组中一个元素的值）{对这个值进行处理....}）
• 数组名.forEach（test）test为方法名，不用加（），把函数引用传进去

Array.prototype.add = function() {
   console.log('yellow');
 }
let arr = new Array('red', 'green', 'blue')

// 方法1
arr.forEach(function(item) {
  console.log(item);  //  red green blue
})
// 方法2
function print(something) {
  console.log(something);  //  red green blue
}
arr.forEach(print);

forEach 这种方法提供一个回调函数，不能使用break语句跳出循环，也不能使用return语句从闭包函数中返回

4、for

5、map：不改变原数组

Array.prototype.add = function() {
   console.log('yellow');
 }
let arr = new Array('red', 'green', 'blue')

arr.map(item => console.log(item)) // red green blue
arr.map((item,index) => {
  console.log(index + ':' + item); // 0:red 1:green 2:blue
})

map调用的数组的每一个元素传递给指定的函数，并返回一个新数组。不改变原数组。函数的参数只有传进来的数组元素

Array.prototype.add = function() {
   console.log('yellow');
 }
let arr = new Array('red', 'green', 'blue')
let arr1 = arr.map(item => item + 1);
console.log(arr); // [ 'red', 'green', 'blue' ]
console.log(arr1);  // [ 'red1', 'green1', 'blue1' ]

这一点与forEach不同，会改变原数组，但是要注意的是，对于原数组中的基本数据类型和引用数据类型，操作不一样，

let arr = [ 1, 2, 3];
console.log(arr);   //  [ 1, 2, 3]
arr.forEach(function(item,index) {
  // item += 1;      //  操作之后原数组并不改变
  arr[index] = item + 1;  // 我们在操作数据的时候，为每个数据都创建了一个item变量，对于基本数据类型， item实际上是新创建的一个内存，其改变并不影响原来地址值的改变，但如果是引用类型，实际上还是一个引用地址。
});
console.log(arr);   // [ 4, 5, 6]

再举例说明：

let obj = {
  name: 'li'
}
let arr = [ 1, 2, obj];
arr.forEach(function(item, index) {
  if (typeof item == 'object') {
    item.age = 18;    // 直接操作 item
  } else {
     item += 1;
    // arr[index] = item + 1;
  }
  
  
})
console.log(arr);  // [ 1, 2, { name: 'li', age: 18 } ]

let obj = {
  name: 'li'
}
let arr = [ 1, 2, obj];
arr.forEach(function(item, index) {
  if (typeof item == 'object') {
    item.age = 18;
  } else {
     //item += 1;
    arr[index] = item + 1;
  }
  
  
})
console.log(arr);   // [ 2, 3, { name: 'li', age: 18 } ]

6、filter：不改变原数组

filter方法有返回值，返回值是一个新的数组。原数组的每一项成员，执行迭代函数的返回值如果为真值，则会将这个成员放进新数组，如果返回值为假值，则不会放入新数组。

let arr = [1, 2, 3];
let arr1 = arr.filter(item => {
  return  item > 1;
})
console.log(arr); // [ 1, 2, 3 ]
console.log(arr1); // [ 2, 3 ]

7、some 和every ： 不改变原数组

• some方法有返回值，如果原数组的每一项成员执行迭代函数的结果，有一项为真值，那么some方法会返回true
• every方法有返回值，如果原数组的每一项成员执行迭代函数的结果，有一项为假值，那么every方法会返回false
• some和every方法的一个优点是，只要确定了结果，就会立即返回结果
• every和some都适合用于对数组成员进行一个条件判断的场景

let arr = [1, 2, 3];
let arr1 = arr.some(item => {
  return  item > 1;
})
let arr2 = arr.every(item => {
  return  item > 1;
})
console.log(arr1); // true
console.log(arr2); // flase

8、reduce : 不改变原数组

reduce方法有两个参数，第一个参数是一个回调函数（必须），第二个参数是初始值（可选）。回调函数有四个参数，依次为本轮循环的累计值、当前循环的元素（必须），该元素的下标（可选），数组本身（可选）。

let arr = [1, 2, 3];
let res = arr.reduce((val, item, index) => {
  return val + item * index;
}, 10);
console.log(arr); // [ 1, 2, 3 ]
console.log(res);  // 18

9、find 和 findIndex (返回第一个符合条件的)

let arr = [1, 1, 2, 3];
let bool1 = arr.find(item => item == 1);  
let bool2 = arr.find(item => item == 4);  
let index1 = arr.findIndex(item => item == 1); 
let index2 = arr.findIndex(item => item == 4);  
console.log(bool1); // 1
console.log(bool2); // undefined
console.log(index1); // 0
console.log(index2); // -1

总结：

对于数组遍历，用for...of 和forEach就已足够，若不想改变原数组，就采用map方法；对于对象的遍历可以采用for...in