使用Object.assign添加属性

Question

我有以下函数：

addHrefs = (list) => {
    const listWithHrefs = list.map((item) => {
        item.href = customFunction(item.name);
        return item;
    });
    return listWithHrefs;
}

这里的问题是我正在改变list对象。我想知道如何在不改变list的情况下添加特定的(key, value)对。使用Object.assign可能吗？我该怎么做？

- FacundoGFlores

Answer 1

使用Object.assign可以完成。

Object.assign()方法用于将一个或多个源对象的可枚举属性值复制到目标对象中。它将返回目标对象。

您可以将属性值赋给新对象并返回它。

addHrefs = list =>
    list.map(item => Object.assign({}, item, { href: customFunction(item.name) }));

- Nina Scholz

---

请注意，这可能不会改变“list”的值，但仍然使用了突变。 - Bergi

@Nina Scholz 它起作用了。但我不明白为什么 list 被改变了（所以我想我必须使用 Object.assign）。我在 JavaScript 控制台中尝试了 map 函数，它没有改变我的列表对象 b = a.map(function(i){return i * 2})，然后 JSON.stringify(a) === JSON.stringify(b) 是错误的，所以我猜这是 ES6 的行为，如果是的话，你能解释一下为什么 list 被改变了吗？ - FacundoGFlores

它会改变list，因为item被改变了，而item是一个对象的引用。你的例子并没有改变任何对象。 - Nina Scholz

Answer 2

您可以将普通对象作为第一个参数传递给Object.assign()，将引用对象作为第二个参数。对分配给Object.assign()的变量执行操作，返回变量。

let list = [{
  a: 1
}, {
  a: 2
}, {
  a: 3
}];

let res = list.map(item => {
  let o = Object.assign({}, item);
  // do stuff with `o`
  o.a = o.a + 10;
  // return `o`
  return o
});

console.log(list, res);

- guest271314