文章目录
- 前言
- 实现原理:
- 调用迭代器
- 自制迭代器
前言
迭代器是 JSt 中一种特殊的对象,它提供了一种统一的、通用的方式遍历个各种不同类型的数据结构。
可以遍历的数据结构包括:数组、字符串、Set、Map 等可迭代对象。我们也可以自定义实现迭代器,以支持遍历自定义的数据结构。
实现原理:
迭代器的实现原理是通过定义一个特定的next() 方法,在每次迭代中返回一个包含两个属性的对象:done
和 value
。
next()方法
- 参数:无参数或者有一个参数。
- 返回值:返回一个有两个属性的对象。属性值如下:
done
:布尔值,表示迭代是否完成
value
:当前步骤的值
每次调用next方法,都会改变value值至下一步,直到迭代完成
据此,可以给数组手写一个迭代器函数
const strArr = ['a', 'b', 'c', 'd'];// 为数组封装迭代器
function create(arr) {let index = 0;return {next: () => {if (index < arr.length) {return { done: false, value: arr[index++] };} else {return { done: true };}},};
}const str = create(strArr);
console.log(JSON.stringify(str.next()));
console.log(JSON.stringify(str.next()));
console.log(JSON.stringify(str.next()));
console.log(JSON.stringify(str.next()));
console.log(JSON.stringify(str.next()));
//输出
// {"done":false,"value":"a"}
// 测试.html:28 {"done":false,"value":"b"}
// 测试.html:29 {"done":false,"value":"c"}
// 测试.html:30 {"done":false,"value":"d"}
// 测试.html:31 {"done":true}
可以看到 ,每调用一次next,value会向后移动,直至遍历完毕
调用迭代器
语法
const a=可迭代对象[Symbol.iterator]()
实例如下
const myArr = ['a', 'b', 'c', 'd'];// 获取数组自带的迭代器对象
const myIterator = myArr[Symbol.iterator]();// 通过迭代器的 next() 方法遍历数组
console.log(JSON.stringify(myIterator.next()));
console.log(JSON.stringify(myIterator.next()));
console.log(JSON.stringify(myIterator.next()));
console.log(JSON.stringify(myIterator.next()));
console.log(JSON.stringify(myIterator.next()));
//输出
// {"value":"a","done":false}
// 测试.html:17 {"value":"b","done":false}
// 测试.html:18 {"value":"c","done":false}
// 测试.html:19 {"value":"d","done":false}
// 测试.html:20 {"done":true}
自制迭代器
很多数据对象由于不是可迭代对象,我们可以为其手动创建一个迭代器
与函数不同,这次将其封装在对象中,并且此后调用方法一致
const myObj1 = {strArr: ['a', 'b', 'c', 'd'],// 在 myObj1 的内部创建一个迭代器[Symbol.iterator]: function () {let index = 0;const Iterator = {next: function () {if (index < myObj1.strArr.length) {return { done: false, value: myObj1.strArr[index++] };} else {return { done: true };}},};return Iterator;},
};// 获取 myObj1 的迭代器对象
const myIterator = myObj1[Symbol.iterator]();
// 通过迭代器遍历 myObj1.strArr 的数据
console.log(JSON.stringify(myIterator.next()));
console.log(JSON.stringify(myIterator.next()));
console.log(JSON.stringify(myIterator.next()));
console.log(JSON.stringify(myIterator.next()));
console.log(JSON.stringify(myIterator.next()));
// 输出
// {"done":false,"value":"a"}
// 测试.html:32 {"done":false,"value":"b"}
// 测试.html:33 {"done":false,"value":"c"}
// 测试.html:34 {"done":false,"value":"d"}
// 测试.html:35 {"done":true}
大部分步骤一致,只是在函数前加上[Symbol.iterator]:
而可迭代对象可以使用for of进行遍历
如下
for(let item of myObj1){console.log(item);
}
//输出同样效果
当自定义类复杂时,自制迭代器也就更难写