react/javascript 中的解构数组答案

【问题标题】：Destructuring array in react/javascriptreact/javascript 中的解构数组
【发布时间】：2020-01-13 10:44:06
【问题描述】：

我有数组

如您所见，它有 4 个元素（created_at、first_name、id、last_name）。

我的问题是，我如何将它解构为一个包含 2 个元素（id，name）的数组

（名字应该是名字+姓氏）

【问题讨论】：

请发布真实的 javascript 数据，而不是来自控制台的图像。
你拥有的是一个由 2 个对象组成的数组，每个对象包含 4 个键

标签： javascript arrays reactjs destructuring

【解决方案1】：

只需使用map:

arr.map(({id, first_name, last_name}) => { return {id, name: first_name + ' ' + last_name}})

一个例子：

let arr = [{
    "id": 100,
    "first_name": "first_name_1",
    "last_name": "last_name_1",

},
{
    "id": 101,
    "first_name": "first_name_2",
    "last_name": "last_name_2",
}
];

console.log(arr.map(({id, first_name, last_name}) => { return {id, name: first_name + ' ' + last_name}}))

【讨论】：

也许在first_name和last_name之间加一个空格
我写了同样的答案，但在我按下帖子之前，这个答案进来了哈哈，赞成这个
您也可以将对象包裹在括号中，这样您就不需要return关键字

【解决方案2】：

您可以根据需要使用 map 来获取新数组。代码看起来像

const data = [
  {created_at:"2020-01-05", first_name:"Sadio", id:1, last_name:"Marne"},
  {created_at:"2020-01-05", first_name:"Mohamed", id:2, last_name:"Salah"},
  {created_at:"2020-01-05", first_name:"Palash", id:3, last_name:"Kanti"},
  {created_at:"2020-01-05", first_name:"Tuhin", id:4, last_name:"Saha"},
  ]

let newArray=data.map(res=>{
  return {id:res.id, name:res.first_name+' '+res.last_name}
});

console.log(newArray)

【讨论】：