for 循环遍历
let array1 = ['a','b','c'];
for (let i = 0;i < array1.length;i++){
console.log(array1[i]);
}
// a b c
foreach() 和map()
Array.forEach(function(value , index , array){
//value为遍历的当前元素，index为当前索引，array为正在操作的数组`
//do something
},this)
//this为执行回调时的this值
Array.map(function(currentValue,index,arr){
//value为遍历的当前元素，index为当前索引，array为正在操作的数组`
//do something
}, thisValue)
不同点：
forEach() 方法对数组的每个元素执行一次提供的函数。返回undefined ；
map() 方法创建一个新数组，其结果是该数组中的每个元素都调用一个提供的函数后返回的结果。返回值是一个新的数组；
例子如下：
var array1 = [1,2,3,4,5];
var x = array1.forEach(function(value,index){
console.log(value); //可遍历到所有数组元素
return value + 10
});
console.log(x); //undefined 无论怎样，总返回undefined
var y = array1.map(function(value,index){
console.log(value); //可遍历到所有数组元素
return value + 10
});
console.log(y); //[11, 12, 13, 14, 15] 返回一个新的数组
for ··· in ··· / for ··· of ···
for...in 语句以任意顺序遍历一个对象的可枚举属性。对于每个不同的属性，语句都会被执行。每次迭代时，分配的是属性名
补充 : 因为迭代的顺序是依赖于执行环境的，所以数组遍历不一定按次序访问元素。 因此当迭代那些访问次序重要的 arrays 时用整数索引去进行 for 循环 (或者使用 Array.prototype.forEach() 或 for...of 循环) 。
let array2 = ['a','b','c']
let obj1 = {
name : 'lei',
age :'16'
}
for(variable in array2){ //variable 为 index
console.log(variable ) //0 1 2
}
for(variable in obj1){ //variable 为属性名
console.log(variable) //name age
}
ES6新增了 遍历器(Iterator)机制，为不同的数据结构提供统一的访问机制。只要部署了Iterator的数据结构都可以使用 for ··· of ··· 完成遍历操作 ( Iterator详解 ： http://es6.ruanyifeng.com/#docs/iterator )，每次迭代分配的是属性值
具备 Iterator 接口的数据结构如下：Array Map Set String TypedArray
let array2 = ['a','b','c']
for(variable of array2){
//variable 为 value
console.log(variable ) //'a','b','c'
}
let divList = document.querySelectorAll('div');
for(element of divlist){
//可遍历所有的div节点
//do something
}
如何让普通对象可以用for of 进行遍历呢？ http://es6.ruanyifeng.com/#docs/iterator 一书中有详细说明了！除了迭代时分配的一个是属性名、一个是属性值外，for in 和 for of 还有其他不同 (MDN文档： https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/for...of)
for...in循环会遍历一个object所有的可枚举属性。
for...of会遍历具有iterator接口的数据结构
for...in遍历（当前对象及其原型上的）每一个属性名称,而 `for...of遍历（当前对象上的）每一个属性值
Object.prototype.objCustom = function() {};
Array.prototype.arrCustom = function() {};
let iterable = [3, 5, 7];
iterable.foo = "hello";
for(let i in iterable) {
console.log(i); // logs 0, 1, 2, "foo", "arrCustom", "objCustom"
}
for(let i of iterable) {
console.log(i); // logs 3, 5, 7
}