本文详解为何在 forEach 循环中复用同一对象引用会导致所有数组元素内容相同，并提供安全、可复用的初始化方案。
本文详解为何在 `foreach` 循环中复用同一对象引用会导致所有数组元素内容相同，并提供安全、可复用的初始化方案。
在 JavaScript 中，对象是引用类型。当你在循环外部声明一个对象（如 aSeries = { name: '', data: [{}] }），然后在每次迭代中仅修改其属性（如 aSeries.name = element）并推入数组，实际上你只是将同一个对象的多个引用存入了 seriesArray。最终所有数组项都指向内存中的同一对象，因此最后一次赋值（name: 'incline'）会覆盖全部，导致输出中两个元素名称均为 "incline"。
✅ 正确做法是在每次迭代内部创建新对象，确保每个数组项持有独立的内存实例：
const seriesTitles = ['depth', 'incline'];
const seriesArray = [];
seriesTitles.forEach((title) => {
// ✅ 每次迭代新建对象 —— 关键修复点
const aSeries = {
name: title,
data: [{}]
};
seriesArray.push(aSeries);
});
console.log(seriesArray);
// 输出：
// [
// { name: "depth", data: [{}] },
// { name: "incline", data: [{}] }
// ]? 进阶优化建议：
- 使用 map() 替代 forEach + push，语义更清晰、代码更函数式：
const seriesArray = seriesTitles.map(title => ({ name: title, data: [{}] })); - 若 data 数组需动态填充 JSON 数据，可在构造时直接注入，例如：
const jsonData = [{ x: 0, y: 10 }, { x: 1, y: 15 }]; const seriesArray = seriesTitles.map(title => ({ name: title, data: jsonData // 或深拷贝后使用：JSON.parse(JSON.stringify(jsonData)) }));
⚠️ 注意事项：
立即学习“Java免费学习笔记（深入）”；
- 避免在循环外定义对象/数组后在循环内重复赋值——这是引发“意外共享状态”的常见根源；
- 若对象结构复杂或含嵌套对象，需注意浅拷贝（{...obj}）或深拷贝（structuredClone 或 JSON.parse(JSON.stringify())）以防止深层引用污染；
- 在现代项目中，优先选用 const 声明 + map() 等不可变操作，提升代码可预测性与可维护性。
掌握对象生命周期与引用机制，是写出健壮 JavaScript 数据初始化逻辑的关键一步。
