如何在含多对象的大型数组中累加值并保留历史计算结果？

需求说明 #

我有一个包含大量对象的大型数据数组，需要对数组中每个对象的X、Y、marker.color三个字段做逐帧累加处理，规则如下：

• 第1帧（数组第一个元素）保持原始数据不变
• 第2帧 = 第1帧数据 + 第2帧原始数据（对应字段分别累加）
• 第3帧 = 前两帧累加后的总和 + 第3帧原始数据
• 后续每帧以此类推，最终保留所有帧的历史计算结果

举个累加逻辑的简单示例：1 → 1+2=3 → 3+2=5 →5+6=11 →11+2=13

实现方案 #

可以通过遍历数组，维护一个累加器对象记录当前累计值，同时生成新数组保留每一步的计算结果：

// 假设原始数据数组为originalData
const originalData = [
  // 示例数据结构，替换为你的实际数据
  { X: 1, Y: 2, marker: { color: 10 } },
  { X: 2, Y: 3, marker: { color: 20 } },
  { X: 2, Y: 4, marker: { color: 15 } },
  { X: 6, Y: 5, marker: { color: 5 } },
  { X: 2, Y: 6, marker: { color: 25 } }
];

// 初始化累加器和结果数组
const accumulatedData = [];
let accumulator = {
  X: 0,
  Y: 0,
  marker: { color: 0 }
};

originalData.forEach(item => {
  // 累加当前项对应字段
  accumulator.X += item.X;
  accumulator.Y += item.Y;
  accumulator.marker.color += item.marker.color;
  
  // 深拷贝累加器，避免后续修改影响已存入的历史结果
  const currentFrame = JSON.parse(JSON.stringify(accumulator));
  accumulatedData.push(currentFrame);
});

// accumulatedData即为处理后带完整历史结果的数组
console.log(accumulatedData);

注意事项 #

• 如果原始数据对象层级更深或包含特殊类型（如Date），JSON.parse(JSON.stringify())的深拷贝方式可能不适用，此时可使用递归深拷贝函数或第三方库（如Lodash的_.cloneDeep）
• 若数据量极大，可考虑性能优化，比如避免不必要的深拷贝，或采用分批处理方式

内容的提问来源于stack exchange，提问作者Spawnet