使用 Javascript 如何将作为函数/方法参数的数组添加到对象数组？

Question

我正在尝试将作为参数传递给 Javascript 类方法的数组与也在该方法中创建的对象数组进行匹配。

例如，这是一个传递的数组：

colorSet = ["red","orange","purple","yellow"]

当此数组在下面称为 addColors 的方法中传递时，我需要创建一个对象并根据 colorSet 的长度将该对象推送到一个空数组。这很简单。

 addColors(colorSet) {

  let obj = {}

  for (let i = 0;i<colorSet.length;i++){

   this.legend.push(obj)

  }

但是，在这样做之后，我尝试在同一个 for 循环中将对象键“color”添加到对象数组并将其值设置为 colorSet 中的颜色数组。见下文：

 addColors(colorSet) {

  let obj = {}

  for (let i = 0;i<colorSet.length;i++){

    this.legend.push(obj)

    this.legend[i].color = colorSet[i]

  }

然而，结果如下：

0: Object { color: "yellow" }

1: Object { color: "yellow" }

2: Object { color: "yellow" }

3: Object { color: "yellow" }

我想要的是这样的：

0: Object { color: "red" }

1: Object { color: "orange" }

2: Object { color: "purple" }

3: Object { color: "yellow" }

对此的任何帮助将不胜感激。

Answer 1

这是一个常见问题。您正在改变对象legend[i]- 但是对于所有索引，这i是对同一对象的引用obj，结果是改变任何一个都会改变它们。解决方案：每次简单地推送一个全新的对象，不改变任何东西：addColors(colorSet) {&nbsp; for (let i = 0;i<colorSet.length;i++){&nbsp; &nbsp; this.legend.push({ color: colorSet[i]});&nbsp; }}事实上，您可以通过删除循环并仅使用map方法和剩余参数来简化此过程：addColors(colorSet) {&nbsp; this.legend.push(...colorSet.map(color => ({ color })))}

Answer 2

问题是你有let obj = {};一条线在循环之外for，并且所有被推送到的项目都引用了同一个对象legend。将其移入 for 循环以解决此问题：var legend = [];function addColors(colorSet) {&nbsp; for (let i = 0; i < colorSet.length; i++) {&nbsp; &nbsp; let obj = {}; // <- new object should be defined here&nbsp; &nbsp; legend.push(obj);&nbsp; &nbsp; legend[i].color = colorSet[i];&nbsp; }}addColors(["red", "orange", "purple", "yellow"]);console.log(legend);

Answer 3

您可以直接在循环中创建对象。链接这个。function addColors(colorSet) {&nbsp; const legends = [];&nbsp; for (let i = 0;i<colorSet.length;i++){&nbsp; const obj = {&nbsp; &nbsp; color: colorSet[i]&nbsp; }&nbsp; &nbsp;legends.push(obj)&nbsp; }&nbsp;&nbsp;&nbsp; console.log(legends)&nbsp;&nbsp;&nbsp;}const colorSet = ["red","orange","purple","yellow"];addColors(colorSet);

Answer 4

在 上addColors，问题是您将obj变量推入 for 循环。在 上legend.push(obj)，它推送obj变量的引用，而不是 的值，obj因此所有变量都设置为last-index值。const colorSet = ["red", "orange", "purple", "yellow"];function addColors(colorSet) {&nbsp; const legend = [];&nbsp; for (let i = 0;i< colorSet.length; i++) {&nbsp; &nbsp; legend.push({}); // - Here, instead of pushing `obj`, push initial value `{}`&nbsp; &nbsp; legend[i].color = colorSet[i];&nbsp; }&nbsp;&nbsp;&nbsp; console.log(legend);}addColors(colorSet);简单地说，这可以使用Array.prototype.map来完成const colorSet = ["red","orange","purple","yellow"];const result = colorSet.map((item) => ({ color: item }));console.log(result);