前言

好像一般很少人講到js中的引用和復制，不過弄清楚這個概念可以幫助理解很多東西

先講一下很基礎的東西，看看js中幾種數據類型分別傳的什么

引用：對象、數組、函數

復制：數字、布爾

字符串單獨說明，因為它的特殊性，無法確定是傳遞引用還是復制數值（因為字符串的值是沒法改變的，所以糾結這個問題也是沒意義的）但是用于比較的時候顯然是屬于傳值比較

下面來一起看看詳細的介紹吧

首先我們看下面這個例子：

let age = 18;let age2 = age;console.log(age, age2);

我們會得到以下的值：

18 18

這個相信大家都能很好理解。

那么如果我們改變 age 的值呢？輸出會有什么變化？

age = 20;console.log(age, age2);

我們會得到：

20 18

看到這里大家就奇怪了，上面的結果都很正常啊。

但在 JavaScript 中是有例外的，對于普通數據類型如 integer，string，boolean 可以通過 = 來復制這個變量，但對于 array 和 object 數據類型，= 只能起到引用的效果。

大家可以看下面這個例子：

let arr = ['wes', 'bob', 'faker'];let arr2 = arr;console.log(arr2, arr);arr[2] = 'dean';console.log(arr2, arr);

得到的結果是：

["wes", "bob", "faker"] ["wes", "bob", "faker"]
["wes", "bob", "dean"] ["wes", "bob", "dean"]

我們會發現隨著 arr 的改變，arr2 也會跟著改變。

說明 arr2 并沒有復制 arr 的值，只是引用了它，它們都指向同一個內存中的值。

object 也是一樣的：

let obj = { age: 19, name: 'like', last: 'jam'};let obj2 = obj;console.log(obj, obj2);obj.age = 50;console.log(obj, obj2);

得到的結果是：

{age: 19, name: "like", last: "jam"} {age: 19, name: "like", last: "jam"}
{age: 50, name: "like", last: "jam"} {age: 50, name: "like", last: "jam"}

那么如何復制 array 和 object 呢？

復制 array 的方法：

方法1：

let arr2 = [].concat(arr);

方法2：

let arr2 = arr.slice();

方法3：

let arr2 = Array.from(arr);

方法4：

let arr2 = [...arr];

一般我們比較常用的是方法3和方法4，方法1和方法2比較取巧，但都是可以達到復制 array 的目的的。

ps: [...arr] 是 ES6 中的方法。

復制 object 的方法：

方法1：