如何在满足条件时替换数组对象？动态数组更新优化问询

我需要用另一个动态数组更新原数组，只有point字段会发生变化，数组元素的顺序或索引无关紧要（无需连续）。

原数组如下：

const arrayA = [
  {name: 'John Doe', sport: 'soccer', point: 20},
  {name: 'Jack Kim', sport: 'tennis', point: 10},
  {name: 'Tiger Wood', sport: 'golf', point: 22},
  {name: 'Lewis Hamilton', sport: 'F1', point: 30},
];

用于更新的arrayB可能包含单个或全部元素的新point值：

const arrayB = [
  {name: 'John Doe', sport: 'soccer', point: 50},
  {name: 'Jack Kim', sport: 'tennis', point: 100},
];

期望得到的最终数组：

const newArray = [
  {name: 'John Doe', sport: 'soccer', point: 50},
  {name: 'Jack Kim', sport: 'tennis', point: 100},
  {name: 'Tiger Wood', sport: 'golf', point: 22},
  {name: 'Lewis Hamilton', sport: 'F1', point: 30}
];

原本我想通过.slice删除匹配项后再push arrayB，但觉得这种方式逻辑复杂且不合理。下面是我写的未测试的思路代码，我知道肯定有更简便的解决方式：

let newArray = [];
arrayA.map(v => {
    if(v.sport === arrayB.sport) {
      index = arrayA.findIndex(v.sport)
      arrayA.slice(index);
       newArray = arrayA;
     }
});

newArray.push(arrayB)

优化方案 #

推荐用Map来实现高效匹配更新，逻辑清晰且性能更优：

方案1：生成新数组（不修改原数组，推荐）

// 先将arrayB转换为以sport为键的Map，快速查找对应point
const sportPointMap = new Map(arrayB.map(item => [item.sport, item.point]));

// 遍历原数组，更新对应元素的point，生成新数组
const newArray = arrayA.map(item => ({
  ...item, // 复制原元素的所有属性
  point: sportPointMap.get(item.sport) || item.point // 有更新值则用新值，否则保留原值
}));

方案2：直接修改原数组

如果不需要保留原数组，可以直接在原数组上修改：

const sportPointMap = new Map(arrayB.map(item => [item.sport, item.point]));

arrayA.forEach(item => {
  if (sportPointMap.has(item.sport)) {
    item.point = sportPointMap.get(item.sport);
  }
});

原思路的问题说明 #

你写的示例代码存在几个逻辑错误：

• arrayB.sport是无效的，arrayB是数组，不是单个对象，无法直接获取sport属性
• findIndex的参数应该是回调函数，不是v.sport这种值
• slice方法不会修改原数组，而是返回截取后的新数组，所以arrayA.slice(index)不会改变原arrayA
• newArray.push(arrayB)会把整个arrayB作为一个元素添加到newArray中，不是合并元素

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