javascript - 使用Reduce Javascript更新对象属性并将它们添加到新的Arr中

Question

我尝试在具有键值对属性的对象数组上使用 addKeyAndValue 函数中的reduce，在每个对象中添加一个新的键值对并将其返回到新数组中。 addKeyAndValue 函数接收三个参数:arr、键和要在数组中的每个对象中相加的值。然后，我在Reduce回调中使用push，将数组中的对象推送到累加器中的新数组，并使用括号表示法更新后的新键和值。

var arr = [{name: 'Alonso'}, {name: 'James'}, {name: 'Chris'}, {name: 'Steve'}]

function addKeyAndValue(arr, key, value){
    return arr.reduce(function(acc, nextValue, idx){
        console.log(next);
        acc.push(nextValue[key] = value);
        return acc;
    },[]);
}

预期结果应该是:

addKeyAndValue(arr, 'title', 'Instructor') // 
      [
        {title: 'Instructor', name: 'Alonso'}, 
        {title: 'Instructor', name: 'James'}, 
        {title: 'Instructor', name: 'Chris'}, 
        {title: 'Instructor', name: 'Steve'}
       ]

但是，我在 Chrome 开发控制台中得到的结果是:

(4) ["Instructor", "Instructor", "Instructor", "Instructor"]
0:"Instructor"
1:"Instructor"
2:"Instructor"
3:"Instructor"
length:4
__proto__:Array(0)

我想知道为什么通过 nextValue[key] 传递的值会覆盖整个对象并仅作为字符串返回。当我尝试将现有对象推送到新数组中时，它工作正常，但是当推送 nextValue[key] 时，它会变成未定义，并且当执行上述 nextValue[key] = value code> 它会覆盖对象，生成一个仅包含 instructor 字符串的新数组。我有点困惑，因为我期待不同的结果。

在 nextValue 上使用方括号符号 nextValue[key] ， nextValue 是由 reduce 方法中的回调迭代的数组中的每个对象，我认为在这种情况下会添加一个新的 key 属性 “title”，分配值为“instructor”。

如有任何帮助，我们将不胜感激，谢谢:)。

Answer 1

您的push参数只会导致值被推送，而不是对象。如果您确实希望在一个表达式中实现这一点，则可以使用逗号运算符来解决此问题:

acc.push((nextValue[key] = value, nextValue));

但如果单独执行，可能会更具可读性:

nextValue[key] = value;
acc.push(nextValue);