ES2021 中 Object.assign() 和扩展运算符（...）有什么不同？
Object.assign() 和扩展运算符（...）都是 JavaScript 中常用的对象操作方式，它们可以用来将一个或多个对象合并到一个对象中。在 ES2021 中，这两种方式有了一些新的更新和变化，但它们之间也存在一些不同之处。
Object.assign()
Object.assign() 是一个静态方法，可以将多个源对象的属性值复制到目标对象中。它的语法如下：
Object.assign(target, ...sources)
其中，target 表示目标对象，sources 表示源对象，可以传递一个或多个源对象，这些源对象的属性都将被复制到目标对象中。如果存在同名属性，则后面的源对象中的属性会覆盖前面的源对象中的属性。
Object.assign() 方法有以下几个特点：
可以用来合并多个对象
可以用来浅拷贝对象
对象属性的顺序是无法保证的
以下是一个示例代码：
-- -------------------- ---- ------- ----- ------- - - -- -- -- -- -- - -- ----- ------- - - -- -- -- - -- ----- ------------ - ----------------- -------- --------- -------------------------- -- - -- -- -- -- -- -- -- - -
上述代码中，我们将 object1 和 object2 这两个对象合并到一个新的对象 mergedObject 中，最终 mergedObject 的值为 { a: 1, b: 4, c: 3, d: 5 }。
扩展运算符（...）
扩展运算符（...）是一种语法糖，可以将一个可迭代对象（比如数组、字符串、Set、Map 等）转换成一个由其元素组成的数组。在对象上使用扩展运算符时，会将对象的可枚举属性添加到一个新的对象中。它的语法如下：
{...source}其中，source 表示源对象，它的属性将会被合并到新的目标对象中，返回一个新的对象。
以下是一个示例代码：
-- -------------------- ---- ------- ----- ------- - - -- -- -- -- -- - -- ----- ------- - - -- -- -- - -- ----- ------------ - - ----------- ---------- -- -------------------------- -- - -- -- -- -- -- -- -- - -
上述代码中，我们使用扩展运算符将 object1 和 object2 这两个对象合并到一个新的对象 mergedObject 中，最终 mergedObject 的值为 { a: 1, b: 4, c: 3, d: 5 }。
不同之处
虽然 Object.assign() 和扩展运算符（...）看起来非常相似，但它们之间还是有一些不同之处。
Object.assign() 可以合并多个对象，而扩展运算符（...）只能合并两个对象。
Object.assign() 可以用来浅拷贝对象，而扩展运算符（...）只能用来合并对象。
对象属性的顺序是 Object.assign() 方法执行时源对象的顺序，而扩展运算符（...）是按照 ES6 规范定义的，即先复制原对象的属性，再复制到新对象上。
结论
在实际编程中，根据不同的需求选择不同的方法是非常重要的。如果需要拷贝对象或多个对象合并到一个新的对象中，可以使用 Object.assign()；如果只是两个对象的合并，可以使用扩展运算符（...）。了解它们之间的区别和使用场景，可以提高我们的代码效率和可维护性。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/674ff02dfbd23cf890710938