javascript - 如何连接数组中同一元素的多个属性？

Question

我有一个包含姓名和年龄等个人信息的数组。我想组合其中一些属性来为数组中的每个元素创建一个新属性。

从此数组:

var list = [{name: "James", lastName: "M.", age: 58}, {name: "Rachel", lastName: "W.", age: 51}];

我创建了一个新条目:

list.forEach(function(itm){
  itm.username = {...list.firstName, ...list.last};
});

我想将 list.firstName 与 list.lastName 组合起来创建 list.username。 list.username 将由 list.firstName 和 list.lastName 串联而成。

我尝试使用 .assign() 运算符，但没有成功，它只会导致 TypeError: Cannot read property '0' of undefined。由于某种原因，我在尝试通过 console.log(list.firstName[0]); 简单地查看各个数组属性时收到相同的错误消息。

Answer 1

我假设这是 javascript(基于问题的标签)。在这种情况下，您尝试执行的代码似乎是错误的。

问题解答

var list = [{firstName: "James", lastName: "M.", age: 58}, {firstName: "Rachel", lastName: "W.", age: 51}];

list.forEach((entry) => {
   entry.fullName = entry.firstName + " " + entry.lastName; 
});

console.log(list[0].fullName);

在此解决方案中，我只是循环遍历数组的所有元素，并使用该元素自身属性的值分配一个新属性“fullName”。

有多种方法可以做到这一点，这只是最简单的方法来澄清您的理解。

显示单个属性

console.log(list[0].firstName);

请注意，在本例中，数组索引访问器位于数组名称 list 之后，而不是位于属性/属性名称 firstName 之后。

此外，在您提供的代码中没有属性firstName，因此请进行一些检查，否则它将使用undefined值，并且可能会抛出一些错误，具体取决于您的开发环境.

计算属性(getter 访问器)

您还应该考虑如果属性/特性的值发生变化，数组数据将如何表现。

例如，如果您更改 firstName 属性/属性，那么您需要记住也更新 fullName 属性/属性，否则它们将不同步。

完成此任务的更有效方法是将属性/属性作为计算属性/属性(认为函数或更准确地getters)

示例代码

var list = [{
  firstName: "James",
  lastName: "M.",
  age: 58,
  get fullName() {
    return this.firstName + " " + this.lastName;
  },
}, {
  firstName: "Rachel",
  lastName: "W.",
  age: 51,
  get fullName() {
    return this.firstName + " " + this.lastName;
  },
}];


console.log(list[0].fullName);

您可以在 JavaScript Accessors (Getters and Setters) 了解有关 getter 和 setter 的更多信息。