脚本宝典收集整理的这篇文章主要介绍了TypeScript迭代器，脚本宝典觉得挺不错的，现在分享给大家，也给大家做个参考。
@H_777_1@迭代器
重写迭代器方法需 ECMAScript 2015（ES6） , TyPEScript 需 1.5 以上版本。
可迭代协议
可迭代协议 允许 JavaScript 对象去定义或定制它们的迭代行为, 例如（定义）在一个 for..of 结构中什么值可以被循环（得到）。一些内置类型都是内置的可遍历对象并且有默认的迭代行为, 比如 Array or Map, 另一些类型则不是 (比如Object) 。
为了变成可遍历对象， 一个对象必须实现 @@ITerator 方法, 意思是这个对象（或者它原型链prototype chain上的某个对象）必须有一个名字是 Symbol.iterator 的属性:
使用迭代器
以下代码全部使用 TypeScript, TypeScript 版本号为 2.0.10, 使用 ES6 规范。
VAR someArray = [1, 5, 7];
var someArrayEntries = someArray.entries();
console.LOG(someArrayEntries.toString()); // "[object Array Iterator]"
console.log(someArrayEntries === someArrayEntries[Symbol.iterator]()); // true
console.log([...someArray] ); //[1,5,7]
let iterator = someArrayEntries[Symbol.iterator]();
console.log(iterator.next());
console.log(iterator.next());
console.log(iterator.next());
//[Symbol.iterator] 返回一个对象的无参函数，被返回对象需符合迭代器协议。@H_406_46@
重写迭代器
someArray[Symbol.iterator] = ()=>{
return {
_index:0,
next: function() {
if(this._index < someArray.length ){
return { value: someArray[this._index++], done: false}
}else{
return { value: undefined, done:true}
}
},
[Symbol.iterator]:()=>{
return this;
}
};
};
//在js文件中,可以省略掉对 [Symbol.iterator] 属性的定义。
//next() 返回的数据中,
//done为布尔值,按照约定应为是否已经进行到函数边界的描述
//value 则为当前可迭代对象的某个属性值。在js文件中, done为true 可省略。但实际上,value可以为任何js对象
let someArrayIterator = someArray[Symbol.iterator]();
console.log(someArrayIterator.next()); //{ value: 1, done: false }
console.log(someArrayIterator.next()); //{ value: 5, done: false }
console.log(someArrayIterator.next()); //{ value: 7, done: false }
console.log(someArrayIterator.next()); //{ value: undefined, done: true }
console.log(someArrayIterator.next()); //{ value: undefined, done: true }
someArrayEntries[Symbol.iterator] = ()=>{
return {
_index:0,
next: function() {
if(this._index < someArray.length){
return { value: [this._index,someArray[this._index++]], done: false}
}else{
return { value: [this._index,undefined], done:true}
}
},
[Symbol.iterator]:()=>{
return this;
}
};
};
console.log(someArrayEntries === someArrayEntries[Symbol.iterator]()); //false
iterator = someArrayEntries[Symbol.iterator]();
console.log(iterator.next()); //{ value: [ 0, 1 ], done: false }
console.log(iterator.next()); //{ value: [ 1, 5 ], done: false }
console.log(iterator.next()); //{ value: [ 2, 7 ], done: false }
console.log(iterator.next()); //{ value: [ 3, undefined ], done: true }
console.log(iterator.next()); //{ value: [ 3, undefined ], done: true }
内置迭代器行为
for(let obj of someArray){
console.log(obj);
}
// 1 5 7
let someArrayIterator = someArray[Symbol.iterator]();
let obj = someArrayIterator.next();
while(!obj.done){
console.log(obj.value)
obj = someArrayIterator.next();
}
// 1 5 7
//这里使用 while 来 模拟一部分 for...of 的逻辑。
console.log([...someArray] ); // [ 1, 5, 7 ]
console.log([...someArrayEntries]);//[ [ 0, 1 ], [ 1, 5 ], [ 2, 7 ] ]
//内置可迭代对象皆可使用上述2种语法进行遍历其键值对。
//String, Array, TypedArray, Map and Set 是内置可迭代对象， 因为它们的原型对象都有一个 @@iterator 方法。
//除此之外由用户自己实现的 @@iterator 方法也可以使用上述2中语法。
生成器函数
function* 声明 (function关键字后跟一个星号）定义了一个生成器函数 (generator function)，它返回一个 Generator 对象。
注意:箭头函数 无法作为生成器函数。
-
生成器
>生成器是一种可以从中退出并在之后重新进入的函数。生成器的环境（绑定的变量）会在每次执行后被保存，下次进入时可继续使用。
-
>yield 关键字用来暂停和恢复一个生成器函数 ( (function* 或 legacy generator).
-
>yield* 可以把需要 yield 的值委托给另外一个生成器或者其他任意的可迭代对象。
function* anotherGenerator(i) {
yield i + 1; //yield 会返回当前语句的值，类似于return。但在生成器函数中,return受到使用限制。
yield i + 2;
yield i + 3;
}
function* generator(i){
yield i;
yield* anotherGenerator(i);
yield i + 10;
}
var gen = generator(10);
//执行生成器函数会返回一个生成器，保存了当前函数运行环境上下文，同时定义了next()方法来恢复函数运行直至下一条yield语句。
console.log(gen.next().value); // 10
console.log(gen.next().value); // 11
console.log(gen.next().value); // 12
console.log(gen.next().value); // 13
console.log(gen.next().value); // 20
//使用生成器函数来实现迭代功能，很显然比之前实现 Iterator 系列接口要方便快捷的多。
以上是脚本宝典为你收集整理的TypeScript迭代器全部内容，希望文章能够帮你解决TypeScript迭代器所遇到的问题。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。