javascript中的值傳遞和引用傳遞的示例分析

這篇文章給大家分享的是有關javascript中的值傳遞和引用傳遞的示例分析的內容。小編覺得挺實用的，因此分享給大家做個參考，一起跟隨小編過來看看吧。

值傳遞是針對基本類型的，而引用傳遞是針對引用類型的。傳參可以理解為：復制變量的值，把這個副本傳遞給形參。

基本類型復制后，形參與實參完全是獨立的，不管改變哪一個，都不會對另一個產生影響。

引用傳遞本質上還是傳值，具體的步驟是：1、先在棧中開辟形參引用。2、把實參引用的值傳遞給形參引用。

1、值傳遞

function add(num) {
    num++;
    console.log("形參：", num);
}

var a = 20;
add(a);
console.log("實參：", a);

結果如下：

根據結果分析：調用add(a)，傳遞的實參a=20，把實參復制一份，把復制本傳遞給形參num，所以num++后并沒有影響實參a的值。

2、引用傳遞

function setNum(obj) {
    obj.num = 10;
    console.log("形參：", obj);
}

var a = new Object();
setNum(a);
console.log("實參：", a);

結果如下：

當var a = new Object();時，下圖時變量和對象的關系：

調用setNum(a);時，下圖是全局變量a和局部變量obj以及對象Object的關系：

這段代碼創建了一個Object對象，變量（引用）a指向這個Object對象。調用setNum(a)，在這個函數內部，obj和a都引用的是同一Object對象，即a和obj都指向同一個堆內存地址。所以，通過傳遞實參引用a，對形參引用obj添加num屬性后，也影響到了實參引用a。所以，很多人就會被這種假象所蒙蔽，錯誤的認為：在局部作用域修改對象，會在全局對象中反映出來，就說明參數是引用傳遞。

所以，以下是我的進一步分析：

function setNum(obj) {
    obj.num = 10;
    obj = new Object();
    obj.num = 20;
    console.log("形參：", obj);
}

var a = new Object();
setNum(a);
console.log("實參：", a);

結果如下：

在函數內部創建obj對象 obj = new Object(); 下圖是a和obj以及Object的關系：

這段代碼在前一個的基礎上，給setNum()函數中添加了兩行代碼：obj = new Object()改變了obj的指向；obj.num = 20給新創建的obj添加屬性。根據結果來看，形參的改變并沒有影響到實參，所以，在JS中，引用傳遞的本質就是值傳遞。

感謝各位的閱讀！關于“javascript中的值傳遞和引用傳遞的示例分析”這篇文章就分享到這里了，希望以上內容可以對大家有一定的幫助，讓大家可以學到更多知識，如果覺得文章不錯，可以把它分享出去讓更多的人看到吧！