for...in遍历对象所有可枚举属性（含原型链），不适用于数组；for...of仅遍历可迭代对象（如Array、Map），依赖[Symbol.iterator]，遍历对象需用Object.entries()等方法。
for...in 会遍历对象所有可枚举属性，包括原型链上的
它本意是为遍历对象设计的，但实际行为常让人意外：不仅遍历自身属性，还会进入原型链；对数组使用时，会把索引当作字符串键来处理，还可能遍历到意外添加的非数字属性。
常见错误现象：for...in 遍历 Array 时输出 "0"、"1"、"length"，甚至你手动加的 arr.custom = "test" 也会出现。
- 只适合明确要遍历「对象键名」且需兼容旧环境的场景
- 遍历前建议用
hasOwnProperty()过滤掉继承属性 - 绝对不要用它遍历数组——顺序不保证，类型不可靠，性能也差
for...of 只能遍历可迭代对象（Array、Map、Set、String 等），不支持普通对象
for...of 依赖对象的 [Symbol.iterator] 方法。数组天然支持，所以能直接拿到每个元素值；但普通 plain object 没这个接口，直接写 for...of obj 会报错：TypeError: obj is not iterable。
使用场景：
立即学习“Java免费学习笔记（深入）”；
- 遍历数组元素（推荐替代
for...in和传统for (let i = 0; ...)） - 遍历
Map得到[key, value]元组，Set得到唯一值 - 配合
entries()/keys()/values()控制遍历内容
const arr = ['a', 'b', 'c'];
for (const item of arr) {
console.log(item); // 'a', 'b', 'c'
}
const map = new Map([['x', 1], ['y', 2]]);
for (const [k, v] of map) {
console.log(k, v); // 'x' 1, 'y' 2
}
遍历对象的正确方式：Object.keys() + for...of 或 Object.entries()
想安全、清晰地遍历对象自身可枚举属性，应该先转成数组，再用 for...of ——这样既避开原型干扰，又保持语义明确。
-
Object.keys(obj)→ 得到键名数组，适合只操作 key -
Object.values(obj)→ 得到值数组 -
Object.entries(obj)→ 得到[key, value]二维数组，最常用
const user = { name: 'Alice', age: 30 };
for (const [key, value] of Object.entries(user)) {
console.log(key, value); // 'name' 'Alice', 'age' 30
}
注意：Object.* 系列方法只返回**自身可枚举属性**，不包含 Symbol 键或不可枚举属性（如 obj.toString）；需要 Symbol 键时得用 Reflect.ownKeys() + 手动过滤。
for...in 和 for...of 在性能与语义上的根本差异
for...in 是「按属性名反射式查找」，引擎需检查原型链、过滤不可枚举项；for...of 是「按迭代协议拉取值」，路径固定、无反射开销，V8 等引擎对其做了深度优化。
容易被忽略的地方：
-
for...in的遍历顺序在 ES2015 前不保证，现在虽对数字键有排序，但混合字符串键仍可能乱序 -
for...of对稀疏数组（如arr[0]=1; arr[100]=2）会跳过空位，而for...in会列出"0"和"100" - 箭头函数不能用作
for...of的循环体（语法错误），必须用function或普通块语句
真要兼顾对象和数组的统一遍历？别硬套一个语法——该用 Object.entries() 就用，该用 for...of arr 就直接上，强行抽象反而增加心智负担。
