forEach按索引升序遍历已存在元素，跳过稀疏空位；不响应遍历中数组修改，无法中断循环；不改变原数组但允许回调内修改；不兼容类数组和空数组，无返回值，适用于纯副作用操作。
Array.forEach() 是 JavaScript 中最直观、最常用的数组遍历方法之一，它不返回新数组（返回 undefined），而是专注于“对每一项执行某个操作”。用它处理数组时，代码简洁、意图清晰，非常适合副作用操作（如打印、修改外部变量、发起请求、更新 DOM 等）。
基本语法与核心特点
forEach 接收一个回调函数作为参数，该函数会为数组中每个**已赋值的元素**（跳过空位）依次调用：
- 回调函数默认接收三个参数：当前元素（item）、当前索引（index）、原数组（array）
- 它不会改变原数组，也不支持中断（没有
break或return false跳出循环） - 无法链式调用（因为返回
undefined），若需转换或筛选，请改用map()或filter()
常见实用场景与写法
✅ 批量更新 DOM 元素：
比如给多个按钮统一绑定点击事件：
const buttons = document.querySelectorAll('.action-btn');
buttons.forEach((btn, i) => {
btn.addEventListener('click', () => console.log(`第 ${i + 1} 个按钮被点击`));
});
✅ 收集或累加信息（配合外部变量）：
统计字符串数组中总字符数：
let totalLength = 0; ['hello', 'world', 'js'].forEach(str => totalLength += str.length); console.log(totalLength); // 15
✅ 发起并行请求（注意：非等待顺序执行）：
适合不需要按序等待响应的场景：
const urls = ['/api/user/1', '/api/user/2', '/api/user/3']; urls.forEach(url => fetch(url).then(res => res.json()).then(data => console.log(data)));
需要避开的典型误区
-
误以为能跳出循环：在 forEach 回调里写
return只是退出当前回调，不会终止整个遍历。真要提前退出，请改用for...of或some()/every() -
混淆 this 绑定：回调中的
this默认是undefined（严格模式）。如需指定上下文，可传入第二个参数：arr.forEach(callback, thisArg) -
对稀疏数组行为误解：forEach 会跳过未定义的空槽（如
[1, , 3]中间那个位置），但不会跳过undefined值（如[1, undefined, 3]会触发三次）
替代方案何时更合适
当你的目标不是“执行动作”而是：
-
生成新数组 → 用
map() -
筛选符合条件的项 → 用
filter() -
汇总计算（如求和、拼接） → 用
reduce() -
需要中途退出或复杂控制流 → 直接用
for或for...of
forEach 的优雅，在于它把“我要对每个元素做点事”这个意图表达得干净利落。只要目的明确、无需返回值、不依赖中断，它就是最自然的选择。
立即学习“Java免费学习笔记（深入）”；
