JavaScript迭代器与可迭代协议解析

一分耕耘，一分收获！既然都打开这篇《JavaScript迭代器与可迭代协议详解》，就坚持看下去，学下去吧！本文主要会给大家讲到等等知识点，如果大家对本文有好的建议或者看到有不足之处，非常欢迎大家积极提出！在后续文章我会继续更新文章相关的内容，希望对大家都有所帮助！

迭代器是具有next()方法的对象，每次调用返回{value: ..., done: true|false}；可迭代协议通过[Symbol.iterator]方法使对象支持for...of遍历。

JavaScript 中的迭代器（Iterator）和可迭代协议（Iterable Protocol）是一套配合使用的机制，用来统一数据遍历的方式。简单说：可迭代协议规定“这个对象能不能被 for...of 遍历”，而迭代器定义“怎么一步步把它的值取出来”。

迭代器是什么？

迭代器是一个有 next() 方法的对象，每次调用都返回一个形如 { value: ..., done: true|false } 的对象：

• value 是当前遍历到的值（可以是任意类型）
• done 是布尔值，为 true 表示遍历结束

例如，手动创建一个简单迭代器：

const counter = {
  [Symbol.iterator]() {
    let i = 0;
    return {
      next() {
        if (i 

可迭代协议是怎么回事？

一个对象只要拥有名为 Symbol.iterator 的方法，并且该方法返回一个符合迭代器协议的对象，它就是“可迭代的”。for...of、展开运算符（...）、Array.from() 等语法都会自动调用这个方法。

内置类型如 Array、String、Map、Set 都实现了这个协议，所以能直接用于 for...of。

让自定义对象支持 for...of

只需在对象上定义 [Symbol.iterator]() 方法，返回一个迭代器对象即可。常见写法有三种：

• 返回已有迭代器：比如包装数组，直接 return this.items[Symbol.iterator]();
• 手写 next 逻辑：像上面 counter 示例那样，控制状态并逐步返回值
• 用生成器函数（最简洁）：function* () { yield ... }，引擎自动实现迭代器接口

用生成器改写 counter 示例：

const counter = {
  [Symbol.iterator]: function* () {
    for (let i = 0; i 

注意几个关键点

• Symbol.iterator 必须是函数，不能是箭头函数（否则无法正确绑定 this）
• 迭代器应是“惰性”的：next() 被调用时才计算下一个值
• 多次 for...of 同一个对象，每次应得到独立的迭代器（即每次调用 [Symbol.iterator] 都返回新迭代器），否则可能互相干扰
• 如果 done 为 true 后还继续调用 next()，value 应为 undefined，done 仍为 true

不复杂但容易忽略。

以上就是本文的全部内容了，是否有顺利帮助你解决问题？若是能给你带来学习上的帮助，请大家多多支持golang学习网！更多关于文章的相关知识，也可关注golang学习网公众号。