JavaScript中沒(méi)有指針，并且JavaScript中的引用與我們通常看到的大多數(shù)其他流行編程語(yǔ)言的工作方式不同。在JavaScript中，不可能有一個(gè)變量到另一個(gè)變量的引用。而且，只有復(fù)合值（例如對(duì)象或數(shù)組）可以通過(guò)引用來(lái)賦值。

整片文章中將使用下列屬于：

標(biāo)量–單個(gè)值或數(shù)據(jù)單元（如整數(shù)、布爾值、字符串）

復(fù)合--由多個(gè)值組成（如數(shù)組、對(duì)象、集合）

原始 - 直接的價(jià)值，而不是對(duì)包含值的東西的引用。

JavaScript的標(biāo)量類型是原語(yǔ)，不像其他一些語(yǔ)言（如Ruby）具有標(biāo)量引用類型。注意，在JavaScript中，標(biāo)量原始值是不可變的，而復(fù)合值是可變的。

概要：

1.分配給變量的值的類型決定該值存儲(chǔ)的是值還是引用。

2.在變量賦值的時(shí)候，標(biāo)量原始值（Number，String，Boolean，undefined，null，Symbol）通過(guò)值來(lái)賦值，復(fù)合值通過(guò)引用來(lái)賦值。

3.JavaScript中的引用僅指向包含的值，不指向其他變量或引用。

4.在JavaScript中，標(biāo)量原始值是不可變的，復(fù)合值是可變的。

通過(guò)值賦值的快速示例

在下面的代碼片段中，我們將一個(gè)標(biāo)量原始值（一個(gè)數(shù)字）分配給一個(gè)變量，因此這里是通過(guò)值來(lái)賦值。首先，變量 batman 被初始化，當(dāng)變量 superman 被分配存儲(chǔ)在 batman 中的值的時(shí)候，實(shí)際上是創(chuàng)建了該值的一個(gè)副本并存儲(chǔ)在變量 superman 中。當(dāng)變量 superman 被修改時(shí)，變量 batman 不會(huì)受到影響，因?yàn)樗鼈冎赶虿煌闹怠?/p>

var batman = 7;var superman = batman; //通過(guò)值來(lái)賦值superman++;console.log(batman); //7console.log(superman); //8

通過(guò)引用賦值的快速示例

在下面的代碼片段中，我們將一個(gè)復(fù)合值（數(shù)組）賦值給一個(gè)變量，因此這里是通過(guò)引用賦值。變量 flash 和 quicksilver 是相同的值（也稱為共享值）的引用。當(dāng)修改共享值時(shí)，引用將指向更新的值。

var flash = [8,8,8];var quicksilver = flash; //通過(guò)引用來(lái)賦值quicksilver.push(0);console.log(flash);//[8,8,8,0]console.log(quicksilver); //[8,8,8,0]

如何創(chuàng)建一個(gè)新的引用

當(dāng)變量中的復(fù)合值被重新賦值的時(shí)候，將創(chuàng)建一個(gè)新的引用。在JavaScript中，與大多數(shù)其他流行的編程語(yǔ)言不同是：引用指向存儲(chǔ)在變量中的值，不指向其他變量或者引用。

var firestorm = [3,6,3];var atom = firestorm; //通過(guò)引用來(lái)賦值console.log(firestorm); //[3,6,3]console.log(atom); //[3,6,3]atom = [9,0,9]; //通過(guò)值來(lái)賦值 (創(chuàng)建新的引用)console.log(firestorm); //[3,6,3]console.log(atom); //[9,0,9]

當(dāng)引用作為函數(shù)參數(shù)傳遞時(shí)，引用如何工作

在下面的代碼片段中，變量 magneto 是一個(gè)復(fù)合值（一個(gè)數(shù)組），因此它作為一個(gè)引用被賦值給了變量 x （函數(shù)參數(shù)）。

在IIFE中調(diào)用的 Array.prototype.push 方法會(huì)通過(guò)JavaScript引用來(lái)改變變量中的值。但是，變量x的重新賦值會(huì)創(chuàng)建一個(gè)新的引用，并且對(duì)變量 x 的進(jìn)一步修改不會(huì)影響到變量 magneto 的引用。

var magneto = [8,4,8];(function(x) {//IIFE x.push(99); console.log(x); //[8,4,8,99] x = [1,4,1]; //重新賦值變量 (創(chuàng)建一個(gè)新的引用) x.push(88); console.log(x); //[1,4,1,88]})(magneto);console.log(magneto); //[8,4,8,99] 如何更改作為函數(shù)參數(shù)通過(guò)JavaScript引用傳遞的復(fù)合變量中的原始值

這里的解決方案是修改引用指向的現(xiàn)有復(fù)合值。在下面的代碼片段中，變量 wolverine 是一個(gè)復(fù)合值（一個(gè)數(shù)組）并且在IIFE中被調(diào)用，變量 x （函數(shù)參數(shù)）是被賦值了一個(gè)引用。

可以通過(guò)將屬性 Array.prototype.length 的值設(shè)置為0來(lái)創(chuàng)建一個(gè)空數(shù)組。因此，變量 wolverine 通過(guò)JavaScript引用更改為變量x中的新值。

var wolverine = [8,7,8];(function(x) { //IIFE x.length = 0; //創(chuàng)建空數(shù)組對(duì)象 x.push(1,4,7,2); console.log(x); //[1,4,7,2]})(wolverine);console.log(wolverine); //[1,4,7,2] 如何通過(guò)按值賦值來(lái)存儲(chǔ)復(fù)合值

這里的解決方案是制作復(fù)合值的手動(dòng)副本，然后將復(fù)制的值分配給變量。因此，分配值的引用不指向原始值。

創(chuàng)建一個(gè)（淺）復(fù)合值副本（數(shù)組對(duì)象）推薦調(diào)用 Array.prototype.slice 方法，而不傳遞任何參數(shù)。

var cisco = [7,4,7];var zoom = cisco.slice(); //創(chuàng)建淺復(fù)制cisco.push(77,33);console.log(zoom); //[7,4,7]console.log(cisco);//[7,4,7,77,33]

如何通過(guò)按引用賦值來(lái)存儲(chǔ)一個(gè)標(biāo)量初始值

這里的解決方案是將標(biāo)量原始值包含在復(fù)合值（即對(duì)象或數(shù)組）中作為其屬性值。因此，它可以通過(guò)引用來(lái)賦值。在下面的代碼片段中，變量 speed 中的標(biāo)量原始值設(shè)置為flash對(duì)象的屬性。因此，在調(diào)用IIFE的時(shí)候，它通過(guò)引用賦值給了 x （函數(shù)參數(shù)）。

var flash = { speed: 88 };(function (x) { //IIFE x.speed = 55;})(flash);console.log(flash.speed); //55 總結(jié)

很好地理解JavaScript中的引用可以幫助開(kāi)發(fā)人員避免許多常見(jiàn)的錯(cuò)誤，并編寫出更好的代碼。

編碼快樂(lè)！！

來(lái)自：https://segmentfault.com/a/1190000009017259