javascript遍历总结

for in 循环

最原始遍历，没什么可说的。
注意的地方：js没有块级作用域，如果for (var i=1;i<10;i++)这样定义的i变量的作用域会影响函数内部，ES6的let定义变量可以解决这个问题。

forEach 循环

ES5中加入了forEach循环
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach

array.forEach(callback(currentValue, index, array){
    //do something
}, this)

1. forEach总是返回undefined。
2. forEach最大问题是不能终止，即不能用break,contince终止循环。
3. 属于Array的方法，不能遍历对象，但可以遍历节点数组。

map 循环

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/map

let array = arr.map(function callback(currentValue, index, array) { 
    // Return element for new_array 
}[, thisArg])

基本语法和forEach差不多，但forEach有个劣势就是返回undefined，这使它不能完成链式调用。而map却返回一个新数组，其结果是该数组中的每个元素都调用一个提供的函数后返回的结果。
比如可以写出漂亮的字符串翻转：

var str = '12345';
Array.prototype.map.call(str, function(x) {
  return x;
}).reverse().join(''); 

for in 遍历

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/for...in

1. for in可以用来遍历数组，但不建议这样用，因为遍历的顺序性不能保证。
2. for in遍历会将propotype原型链中的属性遍历出来，因此在遍历的时候最好加上hasOwnProperty遍历判断。

var triangle = {a:1, b:2, c:3};

function ColoredTriangle() {
  this.color = "red";
}

ColoredTriangle.prototype = triangle;

var obj = new ColoredTriangle();

for (var prop in obj) {
  if( obj.hasOwnProperty( prop ) ) {
    console.log("o." + prop + " = " + obj[prop]);
  } 
}

// Output:
// "o.color = red"

for of 遍历

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/for...of
ES6加入了更为强大的for of遍历。

1. 相比于for in循环， for of克服了自身遍历出原型链的缺点，for of只会遍历当前对象的属性。
2. for of使用广泛，可以遍历包括数组，类数组，对象在内的所有可遍历对象， 可以称其为collection对象。