映射到对象 - JavaScript 中文教程

您有一个包含 user 对象的数组，每个对象都有 name、surname 和 id。

编写代码以从中创建另一个数组，该数组包含具有 id 和 fullName 的对象，其中 fullName 由 name 和 surname 生成。

例如

          let john = { name: "John", surname: "Smith", id: 1 };
let pete = { name: "Pete", surname: "Hunt", id: 2 };
let mary = { name: "Mary", surname: "Key", id: 3 };

let users = [ john, pete, mary ];

let usersMapped = /* ... your code ... */

/*
usersMapped = [
  { fullName: "John Smith", id: 1 },
  { fullName: "Pete Hunt", id: 2 },
  { fullName: "Mary Key", id: 3 }
]
*/

alert( usersMapped[0].id ) // 1
alert( usersMapped[0].fullName ) // John Smith
        

因此，实际上您需要将一个对象数组映射到另一个对象数组。尝试在这里使用 =>。有一个小问题。

let john = { name: "John", surname: "Smith", id: 1 };
let pete = { name: "Pete", surname: "Hunt", id: 2 };
let mary = { name: "Mary", surname: "Key", id: 3 };

let users = [ john, pete, mary ];

let usersMapped = users.map(user => ({
  fullName: `${user.name} ${user.surname}`,
  id: user.id
}));

/*
usersMapped = [
  { fullName: "John Smith", id: 1 },
  { fullName: "Pete Hunt", id: 2 },
  { fullName: "Mary Key", id: 3 }
]
*/

alert( usersMapped[0].id ); // 1
alert( usersMapped[0].fullName ); // John Smith

请注意，在箭头函数中，我们需要使用额外的括号。

我们不能这样写

          let usersMapped = users.map(user => {
  fullName: `${user.name} ${user.surname}`,
  id: user.id
});
        

正如我们所记得的，有两个箭头函数：没有主体 value => expr 和有主体 value => {...}。

在这里，JavaScript 会将 { 视为函数主体的开始，而不是对象的开始。解决方法是将它们包装在“普通”括号中

          let usersMapped = users.map(user => ({
  fullName: `${user.name} ${user.surname}`,
  id: user.id
}));
        

现在很好。