
上QQ阅读APP看本书,新人免费读10天
设备和账号都新为新人
3.9 迭代
迭代本身不是TypeScript/ES6的功能。迭代是面向对象编程语言常见的设计模式。通常,它是一个实现以下接口的对象。

这个接口允许从属于对象的一些序列或集合中取出一个值。
下面代码中的IteratorResult是value和done的健值对。

想象一个场景,在一个frame中存在一个对象,它包含该frame所包含的组件列表。在使用Iterator接口时,可以从该frame对象中取出这些组件,如下所示。


由于迭代本身并不是TypeScript的功能,这些代码可以在没有明确实现Iterator和IteratorResult接口的情况下正常工作。而这对于使用常见的ES6接口来实现代码的一致性非常有用。
很好,这可能会更有帮助。ES6定义了iterable协议,如果它实现了Iterable接口,那么它就包含了[Symbol.iterator]。


不幸的是,frame.next()不适用于这种模式,而且它看起来有点笨重;但IterableIterator接口可以拯救它。


现在,frame.next()和for循环都能正常使用IterableIterator接口了。
迭代器不必迭代有限值,一个典型的例子是Fibonacci队列。


使用ES5来构建代码
上面的代码示例需要编译版本为ES6,然而如果编译版本的JavaScript引擎支持symbol.iterator,它也可以在ES5中正常使用。这可以通过使用带有ES5的ES6库(将es6.d.ts添加到项目中)来实现编译。编译后的代码应该可以运行在Node 4及其以上的版本,以及Google Chrome和一些其他浏览器中。