for...of用于遍历可迭代对象（如数组、字符串、Map、Set等），直接获取元素值；普通对象、null、undefined等默认不可迭代，需转换后使用。

for...of 是 JavaScript 中用于遍历**可迭代对象（iterable）**的循环语法，它直接获取元素值，比 for...in 更安全、更直观，也比传统 for 循环更简洁。

哪些数据结构能用 for...of 遍历

只要实现了 Symbol.iterator 方法的对象，就是可迭代的，for...of 就能遍历它。常见支持类型包括：

• 数组（Array）——最常用
• 字符串（String）——按 Unicode 字符遍历（含 emoji、中文等）
• Map 和 Set —— 分别遍历键值对、唯一值
• TypedArray（如 Uint8Array）——遍历数值元素
• arguments 对象（函数内）和 NodeList（DOM 查询结果）——虽不是 Array，但原生可迭代
• 自定义对象：只要手动部署 [Symbol.iterator]() 方法，也能用 for...of

基本写法和常见用法示例

语法很简单：for (const value of iterable) { ... }，每次循环得到的是当前项的值。

• 遍历数组：
  for (const item of [1, 2, 3]) console.log(item); // 1, 2, 3
• 遍历字符串：
  for (const char of '?a') console.log(char); // '?', 'a'
• 遍历 Map（默认遍历键值对）：
  for (const [key, value] of new Map([['a', 1], ['b', 2]])) console.log(key, value);
• 只取 Map 的键或值：
  for (const key of map.keys()) {...} 或 for (const val of map.values()) {...}

for...of 和 for...in 的关键区别

for...in 遍历对象的**可枚举属性名（包括继承的）**，而 for...of 遍历的是**值本身**，且只适用于可迭代对象。

• for...in 会遍历数组索引（字符串形式），还可能遍历到原型上的属性；不推荐用于数组
• for...of 不会访问对象属性（普通对象默认不可迭代），也不会受原型链影响
• 普通对象（{}）不能直接用 for...of，除非你给它加了 [Symbol.iterator]

不能直接遍历的常见情况

以下结构默认**不支持** for...of，会报错 TypeError: is not iterable：

• 普通对象（{ a: 1, b: 2 }）——需转成 Object.keys() / Object.values() / Object.entries() 后再遍历
• null 和 undefined —— 根本不是对象，更谈不上可迭代
• 没有实现 Symbol.iterator 的类数组对象（如旧版 jQuery 对象）——需用 Array.from() 或展开运算符转为数组