对象字面量 ({...object}) 中的传播语法有何用途?

What purpose does spread syntax inside an object literal ({...object}) serve?

我已经阅读了 上的答案,但仍然不太明白使用(具体){...object} 的目的。

{...object}有什么作用?

我已经在节点 REPL 中测试过了,假设我创建了一个对象:

> const object = { foo: "hello", bar: "world" };

并在新对象字面量中使用扩展运算符来引用它:

> { ...object }
{ foo: 'hello', bar: 'world' }

输出与仅使用对象本身相同:

> object
{ foo: 'hello', bar: 'world' }

{...object}有什么作用?

这不是同一个对象。它对对象自己的可枚举属性(如 Object.assign({}, object) (MDN) 进行浅表复制。您可以在需要时使用它......一个副本,具有对象自己的可枚举属性。:-D

例如,对于多个 MVC 或类似库中的任何一个,您可以在更新状态时使用它,因为不应直接修改状态:

this.setState(oldState => ({...oldState, prop: "new value"}));