JS中值傳遞和引用傳遞的區別有哪些

這篇文章主要介紹了JS中值傳遞和引用傳遞的區別有哪些，具有一定借鑒價值，感興趣的朋友可以參考下，希望大家閱讀完這篇文章之后大有收獲，下面讓小編帶著大家一起了解一下。

JS是什么

JS是JavaScript的簡稱，它是一種直譯式的腳本語言，其解釋器被稱為JavaScript引擎，是瀏覽器的一部分，主要用于web的開發，可以給網站添加各種各樣的動態效果，讓網頁更加美觀。

在JavaScript中，可以通過值和引用傳遞。兩者之間的主要區別是，按值傳遞發生在賦值基本類型的時候，而賦值對象時按引用傳遞。下面詳細看看。

1.理解基本類型和對象

JavaScript提供了2種數據類型：基本類型和對象。

基本類型有 number, boolean, string, symbol,null,undefined。

// 基本類型
const number = 10;

const bool = false;

const str = 'Hello!';

const missingObject = null;

const nothing = undefined;

第二類是對象，普通對象、數組、函數等等都是對象。

// Objects
const plainObject = {
  prop: 'Value'
};

const array = [1, 5, 6];

const functionObject = (n1, n2) => {
  return n1 + n2;
};

換句話說，任何不是基本類型的值都是對象。

2.按值傳遞

按值傳遞的簡單規則是 JS 中的所有基本類型都按值傳遞，就這么簡單。

按值傳遞意味著每次將值賦給變量時，都會創建該值的副本，每一次哦。

舉個例子來看看，假設我們有兩個變量 a 和 b：

let a = 1;
let b = a;

b = b + 2;

console.log(a); // 1
console.log(b); // 3

第一條語句，聲明一個變量 a，并賦值為 1。

第二條語句，聲明一個變量 b，并把 a 的值賦值給它。

最后，b = b + 2增加2并變為3。b變量發生變化，并且該變化不會影響a的值。

3.引用傳遞

通過引用傳遞的方式與值傳遞相比會有所不同。

當創建一個對象時，就獲取一個對該對象的引用。如果兩個變量持有相同的引用，那么改變對象會反映在兩個變量中。

請看下面代碼：

let y = x;

y.push(2);

console.log(x); // [1, 2]
console.log(y); // [1, 2]

第一個語句let x =[1]創建一個數組，定義一個變量x，并使用對創建的數組的引用來初始化變量。

然后let y = x定義一個變量y，并使用存儲在x變量中的引用來初始化y，這是一個引用傳遞。

y通過y.push(2)通來改變數組。因為x和y變量引用相同的數組，所以這種變化會反映在兩個變量中。

注意：為簡單起見，我說變量包含對對象的引用。 但是嚴格說來，JavaScript中的變量包含的值是對對象的引用。

【推薦學習：javascript高級教程】

4.值傳遞和引用傳遞的比較

在比較對象時，理解值和引用之間的區別非常重要。

當使用嚴格比較運算符===時，如果兩個變量的值相同，則它們相等。 以下所有比較均相等

const one = 1;
const oneCopy = 1;

console.log(one === oneCopy); // true
console.log(one === 1);       // true
console.log(one === one);     // true

one和oneCopy具有相同的值1。當兩個操作數都為1時，操作符===的計算結果都為true。

但是比較運算符===在比較引用時的工作方式有所不同。 2個引用只有在引用完全相同的對象時才相等。

ar1和ar2保存對不同數組實例的引用：

const ar1 = [1];
const ar2 = [1];

console.log(ar1 === ar2); // false
console.log(ar1 === [1]);  // false

const ar11 = ar1;
console.log(ar1 === ar11); // true
console.log(ar1 === ar1);  // true

ar1和ar2引用結構相同的數組，但是ar1 === ar2的計算結果為false，因為ar1和ar2引用了不同的數組對象。

僅當比較指向相同對象的引用時，比較運算符才返回true：ar1 === ar11或ar1 === ar1。

5.總結

在JavaScript中，原始類型作為值傳遞：意味著每次分配值時，都會創建該值的副本。

另一方面，對象（包括普通對象，數組，函數，類實例）是引用。 如果修改對象，則引用該對象的所有變量都將看到更改。

比較運算符區分比較值和參考。 僅當引用完全相同的對象時，2個保存引用的變量才相等，但是，無論值源自何處，只要變量具有相同的2個值（分別來自變量，文字等），則2個保存值的變量就相等。

感謝你能夠認真閱讀完這篇文章，希望小編分享的“JS中值傳遞和引用傳遞的區別有哪些”這篇文章對大家有幫助，同時也希望大家多多支持億速云，關注億速云行業資訊頻道，更多相關知識等著你來學習!