在两个数组中匹配元素并更新目标数组内指定条件的元素

嘿，完全懂这种长时间干活后脑子转不动的感觉！咱们直接把这个问题捋清楚，给你最简便的解决方案～

首先看你的需求：只需要遍历第一个数组，把所有name为"bob"的元素的age加1就行，其实根本不需要用到第二个数组（你列的待匹配数组可能是混淆了需求？）。之前用双重循环没成功，大概率是因为不小心重复触发了加1操作，咱们换个简单的方式：

直接修改原数组的简便方法 #

用forEach遍历原数组，检查每个元素的name，符合条件就直接修改age：

const firstArray = [{name: "bob", age: 5}, {name: "bob", age: 6}, {name: "jim", age: 7}];

firstArray.forEach(item => {
  if (item.name === "bob") {
    item.age += 1; // 直接给符合条件的元素age加1
  }
});

console.log(firstArray);
// 输出结果正是你想要的：
// [{name: "bob", age: 6}, {name: "bob", age: 7}, {name: "jim", age: 7}]

为什么双重循环会出问题？ #

猜你可能尝试了嵌套循环去对比两个数组，但这样会导致第一个数组里的每个"bob"元素，会和待匹配数组里的两个"bob"都匹配一次，结果就是每个bob的age被加了两次（比如原age=5会变成7），自然不符合预期。举个错误示例你就懂了：

// 错误的双重循环写法（会导致重复加1）
const firstArray = [{name: "bob", age: 5}, {name: "bob", age: 6}, {name: "jim", age: 7}];
const matchArray = [{name: "bob", age: 5}, {name: "bob", age: 6}];

for (let i = 0; i < firstArray.length; i++) {
  for (let j = 0; j < matchArray.length; j++) {
    if (firstArray[i].name === matchArray[j].name) {
      firstArray[i].age += 1;
    }
  }
}

console.log(firstArray);
// 输出：[{name: "bob", age: 7}, {name: "bob", age: 8}, {name: "jim", age: 7}]
// 这显然不是你要的结果

如果不想修改原数组（创建新数组） #

要是你希望保留原数组不变，可以用map方法返回一个新数组（不会改动原数组的任何元素）：

const firstArray = [{name: "bob", age: 5}, {name: "bob", age: 6}, {name: "jim", age: 7}];

const updatedArray = firstArray.map(item => {
  return item.name === "bob" 
    ? {...item, age: item.age + 1} // 复制原元素并修改age，不影响原对象
    : item; // 不符合条件的元素直接返回
});

console.log(updatedArray); 
// 输出：[{name: "bob", age: 6}, {name: "bob", age: 7}, {name: "jim", age: 7}]
console.log(firstArray); // 原数组保持原样

这样是不是清晰多了？不用复杂的嵌套循环，单循环就能轻松搞定需求～

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