for...in 遍历对象可枚举属性名（字符串键），含原型和额外属性，顺序不可靠；for...of 依赖迭代器协议，只遍历实际值，顺序严格、纯净。
for...in 和 for...of 的本质区别不在语法形式，而在设计目标和底层机制：前者是为遍历对象属性而生，后者是为消费可迭代值而设。不能用 for...in 遍历数组，不是因为它“不能运行”，而是它会违背你对数组遍历的预期——拿到的不是元素，而是不可靠的键名。
for...in 专为对象属性设计，返回的是键名（key）
它遍历的是任意对象（包括数组）的所有**可枚举属性名**，这些名字全是字符串，无论你写 arr[0] 还是 arr["0"]，它看到的都是 "0"。更关键的是，它不区分“数组索引”和“你加的额外属性”或“原型上的方法”：
-
返回类型固定为字符串：即使索引是数字，
typeof index === "string"，直接做数学运算会出错 - 顺序不保证：先按数字键升序，再按添加顺序遍历非数字键，遇到稀疏数组或手动添加属性时顺序混乱
-
污染源明确：只要
Array.prototype上有可枚举属性（比如Array.prototype.myMethod = function(){}），它就会被遍历出来
for...of 依赖迭代器协议，返回的是实际值（value）
它只作用于实现了 [Symbol.iterator] 接口的对象（如数组、字符串、Set、Map）。这个接口定义了“如何一步步取出下一个值”，因此：
-
跳过所有非数据属性：
arr.name = "test"或Array.prototype.extra完全不会出现 -
顺序严格可靠：按索引从 0 到
length-1依次取值，符合数组线性结构直觉 -
值即所见：循环变量直接是元素本身，无需
arr[key]查表，也无需类型转换
为什么 for...in 遍历数组容易踩坑？三个典型场景
假设你有：const arr = ["a", "b"]; arr.custom = "x"; Array.prototype.last = function(){ return this[this.length-1] };
- 用
for...in：可能输出"0"、"1"、"custom"、"last"—— 后两者根本不是数组元素 - 用
for...of：只输出"a"、"b"—— 干净、确定、符合意图 - 想同时拿到索引和值？别硬改
for...in，改用arr.entries()：for (const [i, v] of arr.entries()) { ... }
一句话判断该用谁
问自己一个问题：你想操作的是“属性的名字”，还是“容器里的东西”？
- 要列出一个对象有哪些字段？→ 用
for...in - 要逐个处理一组数据（数组、列表、字符序列）？→ 用
for...of - 不确定对象是否可迭代？先检查
obj[Symbol.iterator]是否存在，而不是猜它是不是“像数组”
