动态将数组中的项目作为新值添加到对象的最佳方法

Question

我正在尝试实现以下目标：

let obj = [
    {"id": "1"},
    {"id": "2"},
    {"id": "3"}
]
const arr = ["a", "b", "c"];

obj = addAtoO(arr, obj); // expected outcome: obj = [{"id": "1", "text": "a"}, {"id": "2", "text": "b"}, {}]

换句话说：动态地将数组中的值作为新值添加到对象中。

这就是我要尝试的：

const addAtoO = (a, o) => {
    o.map((i) => {
        console.log(Object.keys(i));
        // a.forEach((e) => {
        //     console.log(e);
        // });
        i['text'] = 'something'; // just add text for testing
    });
    return o;
};

obj = addAtoO(arr, obj);
console.log('result:');
console.log(obj);

但是似乎必须有更好的方法。

  

非常感谢你们。您所有的解决方案都是正确的。我必须标记一个，所以我选择了最接近该特定问题的一个。

Answer 1

您可以像使用时一样使用map，并使用它的索引从arr数组中获取值，并使用obj和arr中的值创建一个新对象

let obj = [{
    "id": "1"
  },
  {
    "id": "2"
  },
  {
    "id": "3"
  }
]
const arr = ["a", "b", "c"];

let output = obj.map(function(item, index) {
  return Object.assign({}, item, {
    text: arr[index]
  })

})

console.log(output)

否则，您还可以使用forEach并变异原始的obj数组

let obj = [{
    "id": "1"
  },
  {
    "id": "2"
  },
  {
    "id": "3"
  }
]
const arr = ["a", "b", "c"];

obj.forEach(function(item, index) {
  item.text = arr[index]

})

console.log(obj)

Answer 2

您可以像这样使用.map()：

const arr1 = [
  {"id": "1"},
  {"id": "2"},
  {"id": "3"}
]
const arr2 = ["a", "b", "c"];

const merge = (a1, a2) => a1.map((o, i) => Object.assign({}, o, {text: a2[i]}));

console.log(merge(arr1, arr2));

.as-console-wrapper { max-height: 100% !important; top: 0; }

Answer 3

您使用addAtoO的方式表明您并不关心更改原始对象。如果是这样，那么一个简单的forEach就可以做到：

const addAtoO = (arr, obj) => arr.forEach((t, i) => obj[i].text = t);

addToO更改了对象obj的原始数组，因此它不返回任何内容。

示例：

const addAtoO = (arr, obj) => arr.forEach((t, i) => obj[i].text = t);

let obj = [ {"id": "1"}, {"id": "2"}, {"id": "3"}];
const arr = ["a", "b", "c"];

addAtoO(arr, obj);

console.log(obj);

Answer 4

为获得更大的灵活性，我建议对功能和参数使用键。

const addTo = (objects, values, key) =>
        objects.map((o, i) => Object.assign({}, o, { [key]: values[i] }));

console.log(addTo([{ id: "1" }, { id: "2" }, { id: "3" }], ["a", "b", "c"], 'text'));

如果您想对给定的对象进行突变，只需从Object.assign中删除空对象。

const addTo = (objects, values, key) =>
        objects.map((o, i) => Object.assign(o, { [key]: values[i] }));

var objects = [{ id: "1" }, { id: "2" }, { id: "3" }];

addTo(objects, ["a", "b", "c"], 'text');
console.log(objects);

Answer 5

没有必要使事情复杂化。只需使用forEach。

let obj = [{
    "id": "1"
  },
  {
    "id": "2"
  },
  {
    "id": "3"
  }
]
const arr = ["a", "b", "c"];

obj.forEach((object, index) => {
  object.text = arr[index]
})

console.log(obj)