在 ECMAScript 2018 （也就是 ES9）中，新增了 Object Rest/Spread Properties （对象的 rest/spread 属性）这一特性。它也称为对象的扩展语法，可以当做对象的拷贝、合并、分解使用。在前端的开发中，我们会经常用到对象的处理，本文将为大家详细介绍 Object Rest/Spread Properties 这个新特性，并通过示例代码来展示如何使用。
Rest Properties
Rest Properties（剩余参数）可以将对象的剩余部分抽离出来，作为独立的对象。在函数的参数中使用时，非常适合解决对象的合并问题。以下是 Rest Properties 的基本语法：
--- - ------ ------ ------- - - ---- -- - --- - ---------- ---- ------- - - ----
其中 obj 为常规对象，prop1、prop2 为对象中的属性名，rest 则是包含所有其他属性的对象。
下面通过一个示例来演示 Rest Properties 的使用：
--- --- - - -- -- -- -- -- - -- --- - -- ------- - - ---- --------------- -- - ------------------ -- - -- -- -- - -
以上示例中，a 是一个局部变量，它的值为 obj.a 的值；rest 是另外的一个对象，包含了 obj 中除了 a 属性以外的其他属性。
还可以使用 Rest Properties 来作为函数参数的一部分，从而解决合并对象的问题。例如：
-------- -------------------- ----------- -
---------------------- -- -
--- ---- --- -- ------- -
----------- - ------------
-
--
------ -------
-
--- ---- - - -- -- -- - --
--- ---- - - -- -- -- - --
---------------------------- ----- ------- -- - -- -- -- -- -- -- -- - -以上示例中，mergeObjects 函数在其参数 sources 前加了一个 ...，从而将所有后续的参数收集成了一个数组。然后就可以通过遍历 sources 数组来将其所有成员的属性合并到 target 对象中。
Spread Properties
Spread Properties（扩展参数），则相对于 Rest Properties，它允许将一个对象中的所有属性直接展开放到另外一个对象中。以下是 Spread Properties 的基本语法：
--- ---- - - -- -- -- - -- --- ---- - - ------- --
以上示例就是在将 obj1 对象的所有属性展开到了 obj2 前。这种语法可以方便地进行对象克隆的操作。如果在展开对象时，还可以将新的属性合并到展开的对象中。以下是一个示例：
--- ---- - - -- -- -- - -- --- ---- - - -- -- ------- -- ------------------ -- - -- -- -- -- -- - -
以上示例将 obj1 展开到 obj2 后，又额外定义了 { c: 3 }，再次得到了一个全新的对象，包括了 obj1 和新属性 { c: 3 }。
总结
Object Rest/Spread Properties 特性为开发人员提供了更多灵活的对象操作方式，使得对象在合并、拷贝等处理场景下更加方便和高效。现代前端开发中，这个特性也已经越来越被广泛应用。
参考文献
- Object Rest/Spread Properties, by Axel Rauschmayer
- Understanding ES6: Object rest and spread operators
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/64e06a1ef6b2d6eab3b7e415