本文介绍如何将一维数值数组的元素按索引顺序注入对象数组,为每个对象动态添加指定键值对,涵盖 map()(函数式、不可变)和 foreach()(就地修改)两种主流实现方式,并强调边界安全与代码健壮性。
本文介绍如何将一维数值数组的元素按索引顺序注入对象数组,为每个对象动态添加指定键值对,涵盖 map()(函数式、不可变)和 foreach()(就地修改)两种主流实现方式,并强调边界安全与代码健壮性。
在实际开发中,我们常需将平行结构的数据(如 ID 列表与记录列表)进行对齐合并。例如,有一个数值数组 [1, 2, 3] 和一个同长度的对象数组,目标是将数值按索引位置作为新字段(如 index)注入每个对象中,生成增强后的对象数组。
最简洁、推荐的函数式写法是使用 Array.prototype.map():
const tab = [1, 2, 3];
const values = [
{ key1: "a", key2: "b", key3: "c" },
{ key1: "d", key2: "e", key3: "f" },
{ key1: "g", key2: "h", key3: "i" }
];
const result = values.map((obj, i) => ({
...obj,
index: tab[i]
}));
console.log(result);
// → [
// { key1: "a", key2: "b", key3: "c", index: 1 },
// { key1: "d", key2: "e", key3: "f", index: 2 },
// { key1: "g", key2: "h", key3: "i", index: 3 }
// ]该方法创建全新数组,不修改原始数据,符合不可变编程原则,适合 React 等状态驱动场景。
若需直接修改原数组(如性能敏感或明确要求副作用),可使用 forEach():
values.forEach((obj, i) => {
obj.index = tab[i];
});
// 此时 values 已被就地更新⚠️ 重要注意事项:
- 长度一致性校验:上述示例假设两个数组长度相等。生产环境务必先校验:if (tab.length !== values.length) throw new Error('Arrays must have the same length');
- 索引越界防护:若 tab 较短,tab[i] 将返回 undefined;可改用 tab[i] ?? null 提供默认值。
- 键名冲突预防:若对象中已存在 index 字段,扩展运算符会覆盖原值;如需保留原值,应显式判断:...obj, ...(tab[i] !== undefined ? { index: tab[i] } : {})。
总结:优先选用 map() 实现纯函数式合并,保障数据可预测性;仅在必要时采用 forEach() 进行就地更新,并始终辅以长度校验与空值处理,确保代码鲁棒可靠。

















