JavaScript迭代器是什么？for...of原理详解

偷偷努力，悄无声息地变强，然后惊艳所有人！哈哈，小伙伴们又来学习啦~今天我将给大家介绍《JavaScript迭代器是什么？for...of如何运行？》，这篇文章主要会讲到等等知识点，不知道大家对其都有多少了解，下面我们就一起来看一吧！当然，非常希望大家能多多评论，给出合理的建议，我们一起学习，一起进步！

JavaScript迭代器是拥有next()方法的对象，返回{value, done}；for...of通过Symbol.iterator协议遍历，要求对象提供返回有效迭代器的方法，普通对象默认不支持。

JavaScript 迭代器是一个具有 next() 方法的对象，每次调用都返回形如 { value, done } 的结果。其中 value 是当前迭代值，done 是布尔值，为 true 表示遍历结束。它本身不决定“怎么遍历”，只提供“按需取值”的能力。

for...of 循环依赖 Symbol.iterator 接口

for...of 不是靠对象类型判断能否遍历，而是检查对象是否实现了可迭代协议——即是否存在 [Symbol.iterator] 方法，且该方法返回一个有效的迭代器对象。

• 数组、字符串、Set、Map、TypedArray、arguments 等原生类型默认有 [Symbol.iterator]
• 普通对象（如 {a:1, b:2}）默认没有，所以直接 for...of 会报错
• 你可以手动添加 [Symbol.iterator] 让任意对象支持 for...of

for...of 的实际执行过程

当你写 for (const x of iterable) { ... }，JS 引擎内部做了三件事：

• 调用 iterable[Symbol.iterator]() 获取迭代器
• 反复调用该迭代器的 next() 方法，直到 done: true
• 每次把 next().value 赋给循环变量 x，再执行循环体

这和手写迭代逻辑等价：

const iterator = arr[Symbol.iterator]();
let result = iterator.next();
while (!result.done) {
  console.log(result.value);
  result = iterator.next();
}

常见误区与注意事项

• for...in 遍历的是对象的**可枚举属性键名**（包括原型链上的），而 for...of 遍历的是**可迭代对象的值**，二者目标完全不同
• 数组用 for...in 会拿到索引字符串（如 "0"），用 for...of 拿到的是元素值（如 42）
• 想让普通对象被 for...of 遍历，必须自己实现 [Symbol.iterator]，通常返回 Object.entries(obj) 的迭代器即可

基本上就这些。理解迭代器本质是“可控的逐个取值”，for...of 只是它的语法糖，不复杂但容易忽略底层契约。

今天关于《JavaScript迭代器是什么？for...of原理详解》的内容就介绍到这里了，是不是学起来一目了然！想要了解更多关于的内容请关注golang学习网公众号！