一、定义

for...of 是 ES6（ECMAScript 2015）引入的一种用于 遍历可迭代对象（Iterable）的循环语句

二、语法

for (const item of iterable) {// 代码块
}

 参数：

• iterable：一个可迭代对象（如数组、字符串、Set、Map等）。
• item：当前迭代的值。

三、举例

const arr = [10, 20, 30];
for (const value of arr) {console.log(value);
}
// 输出：10, 20, 30

 相比 forEach，for...of 支持 break 和 continue：

for (const value of arr) {if (value === 20) continue;console.log(value);
}
// 输出：10, 30

四、使用

遍历 Set

Set 是无重复值的集合，for...of 可用于遍历：

const mySet = new Set(["a", "b", "c"]);
for (const value of mySet) {console.log(value);
}
// 输出：a, b, c

遍历 Set

for...of 默认遍历 Map 的键值对：

const myMap = new Map([["name", "Alice"],["age", 25]
]);for (const [key, value] of myMap) {console.log(key, value);
}
// 输出：name Alice
//       age 25

遍历 arguments 对象

function test() {for (const arg of arguments) {console.log(arg);}
}
test(1, 2, 3);
// 输出：1, 2, 3

 五、名词解释

1、什么是可迭代对象（Iterable）？

可迭代对象是 实现了 Symbol.iterator 方法 的对象，这意味着它可以被 for...of 遍历。

常见的可迭代对象：

• 数组（Array）

• 字符串（String）

• Set

• Map

• arguments 对象

• NodeList（DOM API 返回的集合）

• TypedArray（比如 Uint8Array）

• 生成器（Generator）

比喻：

symbol.iterator 就像书的“书签功能” 

想象你有一本书这本书就是一个对象，而书签就是 Symbol.iterator。

普通的对象（没有 Symbol.iterator）

就像一本没有书签的书，你只能自己翻页，不知道读到哪里了，也不能按顺序自动阅读。比如：

const obj = { a: 1, b: 2 }; for (const item of obj) { //  报错：obj 不是可迭代对象 console.log(item); }

普通对象 {} 不能直接用 for...of，因为它没有“书签功能”。

数组（自带 Symbol.iterator）

而数组 []、字符串 "abc" 等天生带有书签功能（Symbol.iterator），你可以一页一页顺序读下去：

const arr = [10, 20, 30]; for (const num of arr) { console.log(num); //  输出 10, 20, 30 }

 数组可以 for...of 遍历，因为它天生有 Symbol.iterator（书签功能）。

2、arguments 对象是什么？

在 JavaScript 里，arguments 是一个“类数组”对象（array-like object），用来存储所有传递给函数的参数。

简单来说，当你调用一个函数时，所有参数都会被存到 arguments 里，即使你没有在函数的参数列表中定义它们。

function test() {console.log(arguments); // arguments 是个对象
}test(1, 2, 3, 'hello');
[Arguments] { '0': 1, '1': 2, '2': 3, '3': 'hello' }

从 ES6 开始，arguments 已经不推荐使用，因为它不是数组，很多数组方法不能直接用。
我们应该用剩余参数（Rest 参数） ...args，它会直接生成数组：

注意args是变量名写什么都行

function test(...args) {for (const arg of args) {console.log(arg);}
}test('a', 'b', 'c');
// 输出：
// a
// b
// c

 六、实战

function sum(...nums) {return nums.reduce((a, b) => a + b, 0);
}console.log(sum(10, 20, 30)); // 60
console.log(sum(1, 2, 3, 4, 5)); // 15

就是相当于把传入的值自动组成一个数组