JavaScript中map函数内直接赋值报错？如何批量修改对象数组的name属性

你遇到的报错是ESLint的no-return-assign规则抛出的提示：

Arrow function should not return assignment

该提示对应两个问题：

1. 规则本身是为了规避开发者把相等判断==/===误写为赋值=的逻辑错误，默认禁止在return位置直接写赋值表达式。
2. 你当前的代码逻辑本身不符合需求：map回调隐式返回的赋值表达式a.name = "Harold"的返回值是字符串"Harold"，执行后array1会被覆盖为["Harold", "Harold"]，而非你需要的对象数组。

根据你的使用场景可以选择以下两种实现：

• 允许修改原数组内的对象（不需要保留修改前的对象数据），优先用forEach遍历修改，不需要额外赋值给原数组：

this.array1.forEach(a => a.name = "Harold");

如果一定要用map生成新数组，显式返回修改后的对象即可：

this.array1 = this.array1.map(a => {
  a.name = "Harold";
  return a;
});

• 要求不可变更新（不能修改原对象，比如React/Vue的状态更新场景），可以用展开运算返回新对象，同时规避赋值返回的问题：

// 箭头函数用括号包裹对象，代表隐式返回对象而非代码块
this.array1 = this.array1.map(a => ({
  ...a,
  name: "Harold"
}));

以上所有方案执行后，都能得到你需要的数组结构。

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