在 javascript 中,可迭代对象必须实现 symbol.iterator 方法。原生支持该方法的内置对象包括 array、string、map、set 以及类数组对象如 nodelist 和 arguments。这些对象可以直接用于 for...of 循环或展开运算符。

哪些内置对象原生支持 for...of 循环
JavaScript 引擎通过检查对象的 [Symbol.iterator] 属性来判断其是否可迭代。原生可迭代对象包括 Array、String、Map、Set、TypedArray、arguments 以及 DOM 集合如 NodeList。普通 Object 实例不具备此特性,直接对其使用 for...of 会抛出 TypeError。

const arr = [1, 2, 3];
const str = "abc";
const map = new Map([[1, 'a']]);
const set = new Set([1, 2]);
// 测试 Array
for (let val of arr) console.log(val); // 1, 2, 3
// 测试 String
for (let char of str) console.log(char); // a, b, c
// 测试 Map
for (let entry of map) console.log(entry); // [1, 'a']
// 测试 Set
for (let val of set) console.log(val); // 1, 2
// 测试 Object (错误示例)
// const obj = {a: 1};
// for (let key of obj) console.log(key); // TypeError: obj is not iterable如何将非迭代对象转换为可迭代对象
对于不支持迭代的对象(如普通 Object),可以通过手动实现 Symbol.iterator 方法使其变为可迭代对象。通常结合 Object.keys()、Object.values() 或 Object.entries() 返回的数组来实现,因为这些数组本身是可迭代的。
你是 TypeScript 项目架构专家,专注于脚手架搭建生产就绪的 Node.js 和前端应用。生成包含现代工具链(pnpm、Vite、Next.js)、类型
立即学习“Java免费学习笔记(深入)”;

const obj = { a: 1, b: 2, c: 3 };
// 为对象添加 Symbol.iterator
obj[Symbol.iterator] = function* () {
yield* Object.entries(this);
};
// 现在可以使用 for...of
for (let [key, value] of obj) {
console.log(`${key}: ${value}`);
}
// 输出:
// a: 1
// b: 2
// c: 3类数组对象如何转为真正的可迭代数组
类数组对象(如 arguments 或 NodeList)具有 length 属性和索引属性,但缺少数组方法且不可直接迭代。最标准的做法是使用 Array.from() 或展开运算符 [...iterable] 将其转换为真正的 Array,从而获得完整的可迭代能力和数组方法。
function testArgs() {
// arguments 是类数组,不可直接 for...of
// for (let arg of arguments) {} // Error
// 转换为数组
const argsArray = Array.from(arguments);
// 现在可以迭代
for (let arg of argsArray) {
console.log(arg);
}
}
testArgs(1, 2, 3); // 1, 2, 3
// NodeList 示例
const divs = document.querySelectorAll('div');
const divArray = [...divs];
divArray.forEach(d => console.log(d));

















