要让自定义对象可被for...of遍历，需实现symbol.iterator方法并返回符合迭代器协议的对象。例如myrange类通过[symbol.iterator]()返回包含next()方法的迭代器对象，从而支持for...of循环和扩展运算符。解构赋值与扩展运算符依赖该协议，调用对象的symbol.iterator获取迭代器，依次执行next()读取value直至done为true。实际应用中，迭代器可用于处理无限序列（如斐波那契数列）、统一数据源遍历、构建惰性求值的数据处理管道，以及异步迭代等场景，提升代码通用性与内存效率。
JavaScript的迭代器协议（Iterator Protocol）和可迭代协议（Iterable Protocol）是ES6引入的核心概念，它们为各种数据结构提供了一种统一的遍历机制。简单来说，可迭代对象就是能被
for...of循环遍历的对象，而迭代器则是实际执行遍历操作、并按需提供序列中下一个值的对象。这两个协议的内建实现，让数组、字符串、Map、Set等原生数据结构天然支持迭代，也正是因为它们的存在，解构赋值和扩展运算符才能以我们熟悉的方式，优雅地处理这些数据集合。
可迭代协议和迭代器协议，在我看来，是JavaScript语言设计中非常精妙的一笔，它提供了一种强大的抽象能力，让数据的遍历不再局限于特定的类型，而是通过一套统一的接口来实现。
如何自定义一个可迭代对象，让它也能被for...of
循环？
要让一个自定义对象变得“可迭代”，核心在于实现它的可迭代协议。这听起来有点抽象，但实际操作起来并不复杂。一个对象如果想成为可迭代对象，它必须拥有一个键为
Symbol.iterator的方法。这个方法不接受任何参数，并且需要返回一个符合迭代器协议（Iterator Protocol）的对象。
而一个符合迭代器协议的对象，它必须包含一个
next()方法。每次调用
next()方法时，它会返回一个包含
value和
done两个属性的对象。
value是当前迭代到的值，
done则是一个布尔值，表示迭代是否已经结束。当
done为
true时，
value通常是
undefined（当然，你也可以返回任何值，但约定俗此）。
立即学习“Java免费学习笔记（深入）”；
举个例子，假设我们想创建一个自定义的
Range对象，让它可以像数组一样，生成一个范围内的数字序列：
class MyRange {
constructor(start, end) {
this.start = start;
this.end = end;
}
// 实现可迭代协议
[Symbol.iterator]() {
let current = this.start;
const end = this.end;
// 返回一个迭代器对象
return {
next() {
if (current <= end) {
return { value: current++, done: false };
} else {
return { value: undefined, done: true };
}
}
};
}
}
const range = new MyRange(1, 5);
for (const num of range) {
console.log(num); // 1, 2, 3, 4, 5
}
// 甚至可以这样用
const arrFromRange = [...new MyRange(10, 12)];
console.log(arrFromRange); // [10, 11, 12]你看，通过实现
[Symbol.iterator]()方法，我们就能让
MyRange实例像原生数组一样，被
for...of循环、扩展运算符等处理。这背后的力量，就是迭代器协议和可迭代协议的巧妙结合。这种设计模式，极大地提升了JavaScript的表达能力和代码的通用性，让我们可以用统一的方式处理各种序列数据，无论是内置的还是自定义的。
解构赋值和扩展运算符是如何利用迭代器协议的？
解构赋值（Destructuring Assignment）和扩展运算符（Spread Operator）之所以能如此灵活地处理各种数据集合，其秘密武器正是迭代器协议。它们并没有直接去“看”你是不是一个数组或者Set，而是去“问”你有没有一个
Symbol.iterator方法，如果有，就按迭代器协议来取值。
解构赋值
当你对一个可迭代对象进行数组解构时，比如
[a, b, ...rest] = someIterable;，JavaScript引擎会在幕后做这些事情：
- 它会调用
someIterable
对象的[Symbol.iterator]()
方法，获取到一个迭代器。 - 然后，它会反复调用这个迭代器的
next()
方法。 - 每次调用
next()
返回的对象中，value
属性的值会被依次赋给解构模式中的变量（a
,b
）。 - 当遇到剩余元素（
...rest
）时，它会继续调用next()
，直到done: true
为止，并将剩余的所有value
收集到一个新的数组中赋给rest
变量。
这意味着，无论是数组、字符串还是我们上面自定义的
MyRange对象，只要它实现了可迭代协议，就可以被解构赋值。
const str = "hello"; const [firstChar, secondChar, ...restChars] = str; console.log(firstChar, secondChar, restChars); // h e ["l", "l", "o"] const myRange = new MyRange(100, 102); const [val1, val2] = myRange; console.log(val1, val2); // 100 101
这不仅让代码更简洁，也提供了一种非常声明式的方式来提取数据。
扩展运算符（...
）
扩展运算符在数组字面量或函数调用中使用时，其工作原理与解构赋值类似，也完全依赖于可迭代协议。
当你写
[...someIterable]时，或者在函数调用中
myFunction(...someIterable)时：
- JavaScript引擎同样会调用
someIterable
的[Symbol.iterator]()
方法，获取迭代器。 - 接着，它会不断地调用迭代器的
next()
方法，直到done: true
。 - 每次
next()
返回的value
，都会被“展开”到数组字面量中，或者作为独立的参数传递给函数。
const set = new Set([1, 2, 3]);
const arrFromSet = [...set]; // 调用Set的[Symbol.iterator]
console.log(arrFromSet); // [1, 2, 3]
const customRange = new MyRange(5, 7);
const expandedRange = [...customRange]; // 调用MyRange的[Symbol.iterator]
console.log(expandedRange); // [5, 6, 7]
function sum(a, b, c) {
return a + b + c;
}
const numbers = new MyRange(1, 3);
console.log(sum(...numbers)); // 1 + 2 + 3 = 6 (调用MyRange的[Symbol.iterator]并展开)正是这种对迭代器协议的依赖，让解构赋值和扩展运算符拥有了如此强大的通用性。它们不关心数据“是什么类型”，只关心数据“能不能被迭代”。这使得JavaScript在处理集合数据时，变得异常灵活和富有表现力。
迭代器协议在现代JavaScript开发中有哪些实际应用场景？
迭代器协议和可迭代对象在现代JavaScript开发中，其应用远不止于让
for...of循环和解构赋值工作。它们提供了一种强大的抽象，可以用于多种高级场景，显著提升代码的灵活性和效率。
1. 处理无限序列或大型数据集
一个非常典型的应用场景是处理那些理论上可以无限长，或者实际非常庞大的数据序列。通过自定义迭代器，我们可以实现“按需生成”数据，而不是一次性将所有数据加载到内存中。这对于内存优化和性能至关重要。
例如，你可以创建一个迭代器来生成斐波那契数列，它不需要预先计算出所有项：
function* fibonacciGenerator() {
let a = 0, b = 1;
while (true) {
yield a;
[a, b] = [b, a + b];
}
}
const fib = fibonacciGenerator();
console.log(fib.next().value); // 0
console.log(fib.next().value); // 1
console.log(fib.next().value); // 1
console.log(fib.next().value); // 2
// ...你可以无限地获取下一个斐波那契数这里的
function*（生成器函数）是创建迭代器最简洁的方式，它在内部自动实现了迭代器协议。这种“惰性求值”的特性，对于处理文件流、网络数据包或任何不希望一次性全部加载的数据源都非常有价值。
2. 统一不同数据源的遍历方式
设想一下，你的应用可能从数据库获取数据（可能是数组），从API获取数据（可能是对象数组），或者用户输入的数据（可能是字符串）。如果每种数据源都需要一套不同的遍历逻辑，代码会变得非常冗余。通过将这些数据源封装成可迭代对象，你可以用
for...of循环统一它们的遍历方式，大大简化了代码结构。
比如，一个日志解析器可能需要遍历日志文件中的每一行，或者遍历一个日志事件数组。如果两者都实现为可迭代对象，那么处理它们的逻辑就可以高度复用。
3. 构建可组合的数据处理管道
迭代器可以像乐高积木一样组合起来，形成数据处理管道。你可以创建迭代器来
map（转换）、
filter（过滤）甚至
take（限制数量）另一个迭代器的输出，而且这些操作都是惰性执行的。这意味着只有当实际需要数据时，计算才会发生，从而避免了不必要的中间数组创建和内存消耗。
function* mapIterator(iterable, transformFn) {
for (const item of iterable) {
yield transformFn(item);
}
}
function* filterIterator(iterable, predicateFn) {
for (const item of iterable) {
if (predicateFn(item)) {
yield item;
}
}
}
const numbers = [1, 2, 3, 4, 5];
const processed = mapIterator(
filterIterator(numbers, n => n % 2 === 0),
n => n * 10
);
for (const p of processed) {
console.log(p); // 20, 40
}这种模式在处理大型数据流时尤其强大，它允许你构建高效、内存友好的数据转换流程，而无需担心创建大量的临时中间数据结构。
4. 异步迭代（Async Iterators）
虽然标题没有直接提及，但值得一提的是，迭代器协议的概念也延伸到了异步操作，形成了异步迭代器（Async Iterators）。通过
for await...of循环，你可以优雅地遍历异步数据流，比如WebSocket消息、文件读取流或者分页的网络请求。这为处理异步序列数据提供了一种非常强大的、类似于同步迭代的语法糖。
在我看来，深入理解迭代器协议不仅仅是掌握几个语法特性，它更是理解JavaScript如何处理序列数据、如何实现惰性求值、以及如何构建更灵活、更高效代码的关键。它提供了一种强大的抽象，让我们可以用统一且优雅的方式，处理各种形态的数据流。
