我应该避免在reduce中使用对象传播吗？

Question

给出以下示例：

// option 1
items.reduce((values, item) => ({
     ...values,
     [item.id]: item.name
}), {})


// option 2
items.reduce((values, item) => {
    values[item.id] = item.name;
    return values;
}, {});

在这种情况下，是否有使用对象传播语法的最佳实践赞成或反对意见？

Answer 1

给出以下示例：

// option 1
items.reduce((values, item) => ({
     ...values,
     [item.id]: item.name
}), {})


// option 2
items.reduce((values, item) => {
    values[item.id] = item.name;
    return values;
}, {});

在这种情况下，是否存在使用对象传播语法的最佳实践专家或反对者？

Answer 2

给出以下示例：

// option 1
items.reduce((values, item) => ({
     ...values,
     [item.id]: item.name
}), {})


// option 2
items.reduce((values, item) => {
    values[item.id] = item.name;
    return values;
}, {});

在这种情况下，是否存在使用对象传播语法的最佳实践专家或反对者？

Answer 3

出于性能原因，选项 2 显然更可取：

• 选项 1 在 O(n²) 时间内运行，因为扩展语法在每次迭代时复制 O(n) 属性。 选项 2 在 O(n) 时间内运行。
• 选项 1 创建 O(n²) 垃圾，因为它在每次迭代中创建大小为 O(n) 的垃圾对象。 选项 2 不会产生垃圾。

也就是说，在大多数情况下，您应该使用一个普通的for循环来编写它：

let result = {};
for(let item of items) {
    result[item.id] = item.name;
}

使用for循环也不错，代码比问题中的两个选项更具可读性。 选项 2 可能看起来更像是函数式编程风格，但如果您使用变异来实现您想要的结果，那么您并没有真正进行函数式编程。

有关为什么选项 1 是反模式的更深入讨论，请参阅本文。