ES6的循环与可迭代对象示例详解(2)

for(const [key, value] of foo) {
                     ^
TypeError: Iterator result undefined is not an object

这次 javascript 告诉我们它试图调用 Symbol.iterator 方法,而该对象的确是一个对象,并且实现了 next 方法,但是 next 的返回值不是 javascript 预期的对象。

next 函数需要返回有特定格式的对象——有 value 和 done 这两个键。

next: function() { //... return { done: false, value: 'next value' } }

done 键是可选的。如果值为 true(表示迭代器已完成迭代),则说明迭代已结束。

如果 done 为 false 或不存在,则需要 value 键。 value 键是通过循环此应该返回的值。

所以在代码中放入另一个程序,它带有一个简单的迭代器,该迭代器返回前十个偶数。

class First20Evens { constructor() { this.currentValue = 0 } [Symbol.iterator]( "Symbol.iterator") { return { next: (function() { this.currentValue+=2 if(this.currentValue > 20) { return {done:true} } return { value:this.currentValue } }).bind(this) } } } const foo = new First20Evens; for(const value of foo) { console.log(value) }

生成器

手动去构建实现迭代器协议的对象不是唯一的选择。生成器对象(由生成器函数返回)也实现了迭代器协议。上面的例子用生成器构建的话看起来像这样:

class First20Evens { constructor() { this.currentValue = 0 } [Symbol.iterator]( "Symbol.iterator") { return function*() { for(let i=1;i<=10;i++) { if(i % 2 === 0) { yield i } } }() } } const foo = new First20Evens; for(const item of foo) { console.log(item) }

本文不会过多地介绍生成器,如果你需要入门的话可以看这篇文章。今天的重要收获是,我们可以使自己的 Symbol.iterator 方法返回一个生成器对象,并且该生成器对象能够在 for ... of 循环中“正常工作”。 “正常工作”是指循环能够持续的在生成器上调用 next,直到生成器停止 yield 值为止。

$ node sample-program.js
2
4
6
8
10

参考资料

对象的每个可枚举属性: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...in

总结

到此这篇关于ES6的循环与可迭代对象的文章就介绍到这了,更多相关ES6循环与可迭代对象内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

您可能感兴趣的文章:

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wsgyyf.html