那是一个很普通、但又很不普通的夜晚。晚上 10 点，公司灯没关，咖啡机还在嗡嗡作响，我盯着屏幕里的 JavaScript 代码，心里只有一个念头： “我要把这一堆数据，全都走一遍。”
产品经理给我甩过来一个需求：“把用户列表、配置对象、后端返回的数据，全都处理一遍，别漏，别错。”
我一看数据结构，心里一紧：
- 有数组
- 有对象
- 还有 Map、Set
这时候，代码世界里走出来了三位老熟人，拍了拍我的肩膀：
- for：老实本分的体力活巡逻兵
- for-in：专查“房产证”的对象管理员
- for-of：新时代的优雅漫步者
他们说：“小米，别慌，我们三个，正好管这一摊。”
for 语句：最老牌的“体力型巡逻兵”
1、for 是谁？
如果 JavaScript 是一座城市，那 for 循环，就是最早上岗的巡逻员。他不花哨、不智能，但特别靠谱。
你告诉他三件事：
- 从哪开始
- 什么时候停
- 每一步怎么走
他就一步一步，数着步子给你走完。
2、for 的工作方式，用生活比喻一下
想象你在操场跑步：
- 起点：i = 0
- 终点：i < 5
- 每跑一圈：i++
for 就是那个：“跑完一圈就低头看一眼表，再决定要不要继续跑的人。”
3、for 遍历数组：体力活，但精准
优点很明显：
- 能控制下标
- 能中途 break、continue
- 想怎么跳怎么跳
缺点也很明显：
- 写起来累
- 容易写错下标
- 一不小心就 i <= length，直接翻车
4、什么时候用 for？
我的经验是：
for 更像是 “手动挡” ，懂的人很爽，新手容易熄火。
for-in：对象世界的“房产管理员”
1、for-in 是干嘛的？
有一天，for-in 走过来跟我说：“数组的事你们聊，我只管对象的属性。”
for-in 不关心值排成什么顺序，他只在乎一件事： “这个对象名下，都有哪些属性？”
2、for-in 的本质：遍历“可枚举属性”
简单来说就是：
- 它遍历的是 key
- 包括对象自己 + 原型链上的
这点非常重要。
输出：
这时候 for-in 就像一个查房的管理员：“你家名下的房子，我全都能查到，包括继承来的。”
3、for-in 用在数组？——容易踩坑
看起来没问题，但风险很大：
- index 是字符串 "0"、"1"
- 会遍历自定义属性
- 顺序不保证
所以一句话总结：for-in 天生是给对象用的，不是给数组用的。
4、for-in 的适用场景
for-of：新时代的“优雅漫步者”
1、for-of 出场，自带光环
ES6 之后，for-of 登场了。他走路不急不慢，语气温柔：“你不用管下标，我直接给你值。”
不是瞬间清爽了？
2、for-of 的秘密：迭代器（Iterator）
for-of 不是什么都能遍历。他只认一类东西：可迭代对象（Iterable）
比如：
- Array
- String
- Map
- Set
- arguments
- NodeList
for-of 更像一个散步的人：“这条路怎么铺的我不管，我只管一步步往前走。”
3、 for-of vs for-in，差在哪？
一句话总结：for-in 看产权证，for-of 拿实物。
4、for-of + break：既优雅又强大
不像 forEach 那样“停不下来”，for-of 依然保留了 break / continue 的自由。
三个 for，怎么选？我的真实经验
我把它们想象成三种交通工具：
- for：手动挡轿车
- for-in：房管局系统
- for-of：自动驾驶电车
选型口诀送你一份：
- 要下标，用 for
- 要对象 key，用 for-in
- 要值、要优雅，用 for-of
面试官最爱问的灵魂三连击
Q1：for-in 和 for-of 的核心区别？
答：
- for-in 遍历：可枚举属性名
- for-of 遍历：迭代器返回的值
Q2：为什么不推荐用 for-in 遍历数组？
答：
- 顺序不保证
- 下标是字符串
- 会遍历自定义属性
Q3：for-of 能不能遍历对象？
答：
不能，除非对象实现了迭代器。
总结
那天晚上，我带着 for、for-in、for-of，把需求里的数据一个不落地处理完。关灯走人前，我突然意识到一件事：JavaScript 的循环不是多，而是各司其职。
真正的高手，不是把所有循环写成 for，而是知道：
- 什么时候该用谁
- 为什么用它
END
如果你也曾在数组和对象之间迷茫过，希望这篇故事，能帮你在代码世界里少走点弯路。
我是小米，一个喜欢分享技术的31岁程序员。如果你喜欢我的文章，欢迎关注我的微信公众号“软件求生”，获取更多技术干货！
我们，下篇见~
