在JavaScript中使用单个数组更新数组对象

我很难从单独的数组更新对象值

例如：

mainArray = [
    { "name": "bob", "complete": "25" },
    { "name": "john", "complete": "50" },
    { "name": "mike", "complete": "75" },        
];

colorArray = ["#ff0000", "#00ff00", "#0000ff"];

我需要创建一个组合这些值的新数组

for (i = 0, ilen = mainArray.length; ilen > i; i++) {
    newArray.push({
        name: mainArray[i].name,
        complete: mainArray[i].complete,
        color: '',
    });
}

不管我做什么，我要么只能拿回#0000ff，要么什么都不能用。失败的尝试：

for (j = 0, jlen = newArray.length; jlen > j; j++) {
    for (k = 0, km = colorArray.length; km > k; k++) {
        newArray[j].color = colorArray[k];
    }
}

我们的目标是回来：

newArray = [
    { "name": "bob", "complete": "25", "color": "#ff0000" },
    { "name": "john", "complete": "50", "color": "#00ff00" },
    { "name": "mike", "complete": "75", "color": "#0000ff" }        
];

---

正确的方法是什么

只需根据

colorArray

的索引设置每个人的

color

键即可

var mainArray = [
    { "name": "bob", "complete": "25" },
    { "name": "john", "complete": "50" },
    { "name": "mike", "complete": "75" },        
];
var colorArray = ["#ff0000", "#00ff00", "#0000ff"];
var newArray = [];

for (var i = 0; i < mainArray.length; i++) {
  newArray.push({
    name: mainArray[i].name,
    complete: mainArray[i].complete,
    color: colorArray[i]
  });
}

var mainArray=[
{“name”：“bob”，“complete”：“25”}，
{“姓名”：“约翰”，“完成”：“50”}，
{“name”：“mike”，“complete”：“75”}，
];
var colorArray=[“#ff0000”、“#00ff00”、“#0000ff”]；
var newArray=[]；
对于（变量i=0；i

只需根据

colorArray

的索引设置每个人的

color

键即可

var mainArray = [
    { "name": "bob", "complete": "25" },
    { "name": "john", "complete": "50" },
    { "name": "mike", "complete": "75" },        
];
var colorArray = ["#ff0000", "#00ff00", "#0000ff"];
var newArray = [];

for (var i = 0; i < mainArray.length; i++) {
  newArray.push({
    name: mainArray[i].name,
    complete: mainArray[i].complete,
    color: colorArray[i]
  });
}

var mainArray=[
{“name”：“bob”，“complete”：“25”}，
{“姓名”：“约翰”，“完成”：“50”}，
{“name”：“mike”，“complete”：“75”}，
];
var colorArray=[“#ff0000”、“#00ff00”、“#0000ff”]；
var newArray=[]；
对于（变量i=0；i

使用

Array.map

和

Object.assign

的功能更强大的方法如下

var mainArray=[
{“name”：“bob”，“complete”：“25”}，
{“姓名”：“约翰”，“完成”：“50”}，
{“name”：“mike”，“complete”：“75”}，
];
var colorArray=[“#ff0000”、“#00ff00”、“#0000ff”]；
var newArray=mainArray.map（（x，i）=>
赋值（{}，x，{color:colorArray[i]}）
)
log（newArray）

使用

Array.map

和

Object.assign

的功能更强大的方法

var mainArray=[
{“name”：“bob”，“complete”：“25”}，
{“姓名”：“约翰”，“完成”：“50”}，
{“name”：“mike”，“complete”：“75”}，
];
var colorArray=[“#ff0000”、“#00ff00”、“#0000ff”]；
var newArray=mainArray.map（（x，i）=>
赋值（{}，x，{color:colorArray[i]}）
)
log（newArray）下面有一个不必要的嵌套循环：

for (j = 0, jlen = newArray.length; jlen > j; j++) {
    for (k = 0, km = colorArray.length; km > k; k++) {
        newArray[j].color = colorArray[k];
    }
}

您可以将其更改为：

for (j = 0, jlen = newArray.length; jlen > j; j++) {
    newArray[j].color = colorArray[j];
}

下面有一个不必要的嵌套循环：

for (j = 0, jlen = newArray.length; jlen > j; j++) {
    for (k = 0, km = colorArray.length; km > k; k++) {
        newArray[j].color = colorArray[k];
    }
}

您可以将其更改为：

for (j = 0, jlen = newArray.length; jlen > j; j++) {
    newArray[j].color = colorArray[j];
}

那很有效，谢谢。我仍然不明白JavaScript在这种情况下是如何通过索引“循环”我的颜色数组的。在文档/参考资料中我应该看什么？当您使用索引为
I
的循环时，不要将其视为在数组中循环，而应将其视为在一系列值中循环。在这种情况下，第一次通过循环时，
i
是0，然后是1，然后是2，然后停止，因为比较
3
失败。知道
i
是0、1和2，您可以看到您可以使用
mainArray[i]
访问
mainArray
的第一个元素，也可以使用
colorArray[i]
访问
colorArray
的第一个元素。我们只加入
main
和
color
数组的第一个元素，然后加入第二个元素，等等@FelixGuo伟大的解释我一定误解了for循环的工作原理。我很感激你的解释，谢谢你。我仍然不明白JavaScript在这种情况下是如何通过索引“循环”我的颜色数组的。在文档/参考资料中我应该看什么？当您使用索引为
I
的循环时，不要将其视为在数组中循环，而应将其视为在一系列值中循环。在这种情况下，第一次通过循环时，
i
是0，然后是1，然后是2，然后停止，因为比较
3
失败。知道
i
是0、1和2，您可以看到您可以使用
mainArray[i]
访问
mainArray
的第一个元素，也可以使用
colorArray[i]
访问
colorArray
的第一个元素。我们只加入
main
和
color
数组的第一个元素，然后加入第二个元素，等等@FelixGuo伟大的解释我一定误解了for循环的工作原理。我感谢你的解释。