JavaScript使用map方法修改数组后原数组未变化如何解决

Array.prototype.map 是纯函数，不会修改调用它的原数组，仅会返回一个经过处理的新数组。你当前代码仅执行了map操作，没有接收它的返回值，因此原数组parsedData不会发生变更。
另外你使用const声明parsedData，仅限制该变量的引用地址不能被重新赋值，不会限制数组内部的对象属性修改。

方案1：用新变量接收返回结果（推荐，无副作用） #

这种写法会保留原数组，避免意外修改原数据带来的其他问题，是最常用的写法：

const parsedData = [
  { id: 1, key: 'asdas'},
  { id: 2, key: 'asdas'},
]
// 接收map返回的新数组
const modifiedData = parsedData.map((item) => ({
  ...item,
  key: `modified ${item.key}`
}));
console.log(modifiedData);

方案2：重新赋值给原变量 #

如果不需要保留原数组，可以把变量声明改为let，将map返回值直接赋值给原变量：

// 把const改为let，允许重新赋值
let parsedData = [
  { id: 1, key: 'asdas'},
  { id: 2, key: 'asdas'},
]
parsedData = parsedData.map((item) => ({
  ...item,
  key: `modified ${item.key}`
}));
console.log(parsedData);

方案3：直接修改原数组内部属性 #

如果需要保持原数组的引用地址不变，可以用forEach遍历直接修改每个元素的属性：

const parsedData = [
  { id: 1, key: 'asdas'},
  { id: 2, key: 'asdas'},
]
parsedData.forEach((item) => {
  item.key = `modified ${item.key}`
});
console.log(parsedData);

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