在 ES8 中使用 Rest/Spread 运算符进行对象和数组的深度复制？
在编写前端代码过程中，我们经常需要对对象和数组进行复制。以前我们可能会使用一些 hack 方法来实现复制，如下：
-- -------------------- ---- -------
--- --------- - -
----- -------
---- ---
-------- -
------- ---- ---- ----
----- ---- ------
-------- -----
-
--
-- --------
--- --------- - --------------------------------------这样做的坏处是我们不能复制函数或者不能复制循环引用的对象。而且它也很慢。
但是这个问题在 ES8 中有了一个简单的解决方法，即使用 Rest/Spread 运算符。
Rest/Spread 运算符可以使用 ... 符号来实现。在对象和数组上使用这些运算符，将会复制所有的属性或元素。如下所示：
-- -------------------- ---- -------
-- -- ----------- ---------
----- --------- - -
----- -------
---- ---
-------- -
------- ---- ---- ----
----- ---- ------
-------- -----
-
--
----- --------- - --------------- -- -- ------ ---
----------------------- -- ------ ------- ---- --- -------- -------- ---- ---- ---- ----- ---- ------ -------- -------这个例子中，我们可以看到，Spread 运算符完美地复制了源对象。
如果我们有一个更加复杂的例子，包含循环引用的对象和函数呢？我们可以使用在 Spread 运算符内部定义一个自定义方法来解决这个问题：
-- -------------------- ---- -------
-- -- ----------- -------------------
----- --------- - -
----- -------
---- ---
-------- -
------- ---- ---- ----
----- ---- ------
-------- -----
--
--------- -
--------
--------
---- ------
--
------------ ---------- -
------ ------------- -----
-
--
---------------- - ---------- -- ----
----- --------- - -------------- -------- ----------------------- --------- ------------------------ ------------ --------------------------------------------
----------------------- -- ------ ------- ---- --- -------- -------- ---- ---- ---- ----- ---- ------ -------- ------- --------- --------- ------------ --在这个例子中，我们首先使用 Spread 运算符将源对象浅复制到目标对象中。然后，我们使用 Spread 运算符将源对象的属性和对象和数组通过浅复制的方式转移到新对象里。最后，对于循环引用，我们将它们复制为原始的引用，而对于函数，我们使用 bind 方法来复制它们。
在总结一下，使用 Rest/Spread 运算符是一种非常简单而且快速的对象和数组的复制方式，并且它非常适用于深度复制。所以，当需要复制对象和数组时，不要再使用 hack 方法了，使用 Rest/Spread 运算符吧！
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64abcfe848841e98947a78d7