JavaScript/TypeScript 如何交换对象数组的name和key属性名称

错误原因 #

• 第一种写法：myArray是数组，本身没有name属性，直接对数组解构拿name必然返回undefined，你需要遍历处理数组内的每一个对象元素。
• 第二种写法：
  1. map回调没有返回值，最终生成的数组全是undefined
  2. 只做了把原key赋值给name属性的操作，没有把原name赋值给key属性，逻辑不完整
  3. 直接修改数组内的原对象，会同步修改源数组的内容，产生额外副作用

解决方案 #

优先选择返回新对象的写法，不会修改原数组，无副作用：

const newArray = myArray.map(item => ({
  key: item.name,
  name: item.key
}))

TypeScript环境下带类型标注的写法：

interface ConvertedItem {
  key: string;
  name: string;
}
const newArray = myArray.map((item: { name: string; key: string }): ConvertedItem => ({
  key: item.name,
  name: item.key
}))

如果确实需要直接修改原数组内的对象（不推荐），可以用forEach实现：

myArray.forEach(item => {
  const originalName = item.name;
  const originalKey = item.key;
  item.key = originalName;
  item.name = originalKey;
})

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