基于第二个数组的值更新第一个数组元素名称

本文介绍如何根据第二个数组的值，修改第一个数组中特定元素的名称。假设我们有两个数组：arr 和 arr2，需要根据 arr2 中的 val 值，替换 arr 中 sk 数组内匹配 value 值的元素的 name 值。

示例数据：

<code class="javascript">let arr = [
  {
    sk: [
      { name: '数据1', value: '200' },
      { name: '数据2', value: '300' },
      { name: '数据3', value: '400' },
    ],
  },
  {
    sk: [
      { name: '数据4', value: '500' },
      { name: '数据5', value: '600' },
      { name: '数据6', value: '700' },
    ],
  },
];

let arr2 = {
  name: '数据555',
  val: [200, 300, 500],
};</code>

解决方案：

我们使用 map() 方法遍历 arr 数组，并对每个对象中的 sk 数组进行迭代。如果 sk 元素的 value 值存在于 arr2.val 数组中，则将该元素的 name 值更新为 arr2.name。

<code class="javascript">const result = arr.map(item => {
  item.sk = item.sk.map(skItem => {
    if (arr2.val.includes(parseInt(skItem.value))) {
      return { ...skItem, name: arr2.name };
    }
    return skItem;
  });
  return item;
});

console.log(result);</code>

结果：

<code class="javascript">[
  {
    sk: [
      { name: '数据555', value: '200' },
      { name: '数据555', value: '300' },
      { name: '数据3', value: '400' },
    ],
  },
  {
    sk: [
      { name: '数据555', value: '500' },
      { name: '数据5', value: '600' },
      { name: '数据6', value: '700' },
    ],
  },
]</code>

这段代码使用了 parseInt() 将 skItem.value 转换为整数，以确保与 arr2.val 中的数值进行正确的比较。 map() 方法确保返回一个新的数组，避免修改原始数组。 ...skItem 使用了展开语法，复制了 skItem 对象的属性，避免直接修改原始对象。

这个方法更清晰、高效，并且避免了潜在的错误。 它直接修改了 sk 数组中的对象，而不是创建新的对象，提高了代码效率。