本文深入剖析 for 循环中手动重置索引导致首元素“丢失”的根本原因，揭示 i++ 的执行时序机制，并提供安全、可读、可维护的无限遍历实现方案。
本文深入剖析 for 循环中手动重置索引导致首元素“丢失”的根本原因，揭示 i++ 的执行时序机制，并提供安全、可读、可维护的无限遍历实现方案。
在 JavaScript 中实现数组的无限循环输出（如 [1,2,3,4,5] → 1,2,3,4,5,1,2,3,4,5,...）看似简单，但若直接在 for 循环中修改计数器 i，极易因忽略循环增量机制而引发逻辑偏差。典型问题代码如下：
const li = [1, 2, 3, 4, 5];
for (let i = 0; i < li.length; i++) {
console.log(li[i]);
if (i + 1 === li.length) {
i = 0; // ❌ 错误：重置后仍会触发 i++
}
}为何输出是 1 2 3 4 5 2 3 4 5... 而非 1 2 3 4 5 1 2 3 4 5...？
关键在于 for 循环的执行顺序：
- 执行循环体（含 console.log 和 if 判断）；
- 无条件执行 i++（即增量表达式）；
- 再次判断 i < li.length 是否成立。
当 i === 4（最后一个索引）时：
- 输出 li[4]（即 5）；
- 满足 i + 1 === li.length（5 === 5），执行 i = 0；
- 紧接着 i++ 自动执行 → i 变为 1；
- 下一轮循环输出 li[1]（即 2），跳过了 li[0]（1）。
✅ 正确修复：将 i 重置为 -1
因为 i++ 总会在循环末尾执行，要使下一轮从索引 0 开始，必须让 i 在增量前为 -1：
const li = [1, 2, 3, 4, 5];
for (let i = 0; i < li.length; i++) {
console.log(li[i]);
if (i + 1 === li.length) {
i = -1; // ✅ 正确：i++ 后变为 0，下轮输出 li[0]
}
}
// 输出：1 2 3 4 5 1 2 3 4 5 ...⚠️ 更推荐的工程化方案（避免副作用）
虽然 i = -1 可解题，但直接篡改 for 循环变量易降低可读性与可维护性，且存在潜在风险（如与其他逻辑耦合）。生产环境建议采用以下更清晰、健壮的方式：
立即学习“Java免费学习笔记（深入）”；
方案一：使用 while(true) + 模运算（推荐）
const li = [1, 2, 3, 4, 5];
let i = 0;
while (true) {
console.log(li[i % li.length]);
i++;
// 可选：添加终止条件防止失控（如调试时）
if (i > 20) break; // 示例：仅输出前20项
}方案二：封装为生成器函数（ES6+，最优雅）
function* infiniteLoop(arr) {
let i = 0;
while (true) {
yield arr[i % arr.length];
i++;
}
}
const li = [1, 2, 3, 4, 5];
const iterator = infiniteLoop(li);
// 按需消费（安全可控）
for (let i = 0; i < 12; i++) {
console.log(iterator.next().value); // 1 2 3 4 5 1 2 3 4 5 1 2
}总结与最佳实践
- 根本原因：for 循环的增量表达式 i++ 是强制、不可跳过的步骤，重置 i 必须预留其执行空间；
- 临时修复：设 i = -1 可工作，但属“技巧性 hack”，不推荐长期使用；
- 生产首选：while(true) + 模运算 或 Generator，语义明确、无副作用、易于测试与中断；
- 安全提醒：任何无限循环都应配备显式退出机制（如 break、return 或外部控制），避免阻塞主线程。
