ECMAScript 6 Iterator和for...of循环

遍历器对象。entries() 返回一个遍历器对象，用来遍历[键名, 键值]组成的数组。对于数组，键名就是索引值；对于Set，键名与键值相同。Map结构的iterator接口，默认就是调用entries方法。keys() 返回一个遍历器对象，用来遍历所有的键名。values() 返回一个遍历器对象，用来遍历所有的键值。这三个方法调用后生成的遍历器对象，所遍历的都是计算生成的数据结构。let arr = ['a', 'b', 'c'];for (let pair of arr.entries()) { console.log(pair);}// [0, 'a']// [1, 'b']// [2, 'c']类似数组的对象类似数组的对象包括好几类。下面是for...of循环用于字符串、DOM NodeList对象、arguments对象的例子。// 字符串let str = "hello";for (let s of str) { console.log(s); // h e l l o}// DOM NodeList对象let paras = document.querySelectorAll("p");for (let p of paras) { p.classList.add("test");}// arguments对象function printArgs() { for (let x of arguments) { console.log(x); }}printArgs('a', 'b');// 'a'// 'b'对于字符串来说，for...of循环还有一个特点，就是会正确识别32位UTF-16字符。for (let x of 'a\uD83D\uDC0A') { console.log(x);}// 'a'// '\uD83D\uDC0A'并不是所有类似数组的对象都具有iterator接口，一个简便的解决方法，就是使用Array.from方法将其转为数组。let arrayLike = { length: 2, 0: 'a', 1: 'b' };// 报错for (let x of arrayLike) { console.log(x);}// 正确for (let x of Array.from(arrayLike)) { console.log(x);}对象对于普通的对象，for...of结构不能直接使用，会报错，必须部署了iterator接口后才能使用。但是，这样情况下，for...in循环依然可以用来遍历键名。var es6 = { edition: 6, committee: "TC39", standard: "ECMA-262"};for (e in es6) { console.log(e);}// edition// committee// standardfor (e of es6) { console.log(e);}// TypeError: es6 is not iterable上面代码表示，对于普通的对象，for...in循环可以遍历键名，for...of循环会报错。一种解决方法是，使用Object.keys方法将对象的键名生成一个数组，然后遍历这个数组。for (var key of Object.keys(someObject)) { console.log(key + ": " + someObject[key]);}在对象上部署iterator接口的代码，参见本章前面部分。一个方便的方法是将数组的Symbol.iterator属性，直接赋值给其他对象的Symbol.iterator属性。比如，想要让for...of环遍历jQuery对象，只要加上下面这一行就可以了。jQuery.prototype[Symbol.iterator] = Array.prototype[Symbol.iterator];另一个方法是使用Generator函数将对象重新包装一下。function* entries(obj) { for (let key of Object.keys(obj)) { yield [key, obj[key]]; }}for (let [key, value] of entries(obj)) { console.log(key, "->", value);}// a -> 1// b -> 2// c -> 3与其他遍历语法的比较以数组为例，JavaScript提供多种遍历语法。最原始的写法就是for循环。for (var index = 0; index < myArray.length; index++) { console.log(myArray[index]);}这种写法比较麻烦，因此数组提供内置的forEach方法。myArray.forEach(function (value) { console.log(value);});这种写法的问题在于，无法中途跳出forEach循环，break命令或return命令都不能奏效。for...in循环可以遍历数组的键名。for (var index in myArray) { console.log(myArray[index]);}for...in循环有几个缺点。数组的键名是数字，但是for...in循环是以字符串作为键名“0”、“1”、“2”等等。for...in循环不仅遍历数字键名，还会遍历手动添加的其他键，甚至包括原型链上的键。某些情况下，for...in循环会以任意顺序遍历键名。总之，for...in循环主要是为遍历对象而设计的，不适用于遍历数组。for...of循环相比上面几种做法，有一些显著的优点。for (let value of myArray) { console.log(value);}有着同for...in一样的简洁语法，但是没有for...in那些缺点。不同用于forEach方法，它可以与break、continue和return配合使用。提供了遍历所有数据结构的统一操作接口。下面是一个使用break语句，跳出for...of循环的例子。for (var n of fibonacci) { if (n > 1000) break; console.log(n);}上面的例子，会输出斐波纳契数列小于等于1000的项。如果当前项大于1000，就会使用break语句跳出for...of循环。