深入理解JavaScript 參數(shù)按值傳遞
定義
ECMAScript中所有函數(shù)的參數(shù)都是按值傳遞的。
什么是按值傳遞呢?
也就是說(shuō),把函數(shù)外部的值復(fù)制給函數(shù)內(nèi)部的參數(shù),就和把值從一個(gè)變量復(fù)制到另一個(gè)變量一樣。
按值傳遞
舉個(gè)簡(jiǎn)單的例子:
var value = 1;
function foo(v) {
v = 2;
console.log(v); //2
}
foo(value);
console.log(value) // 1
很好理解,當(dāng)傳遞 value 到函數(shù) foo 中,相當(dāng)于拷貝了一份 value,假設(shè)拷貝的這份叫 _value,函數(shù)中修改的都是 _value 的值,而不會(huì)影響原來(lái)的 value 值。
引用傳遞
拷貝雖然很好理解,但是當(dāng)值是一個(gè)復(fù)雜的數(shù)據(jù)結(jié)構(gòu)的時(shí)候,拷貝就會(huì)產(chǎn)生性能上的問(wèn)題。
所以還有另一種傳遞方式叫做按引用傳遞。
所謂按引用傳遞,就是傳遞對(duì)象的引用,函數(shù)內(nèi)部對(duì)參數(shù)的任何改變都會(huì)影響該對(duì)象的值,因?yàn)閮烧咭玫氖峭粋€(gè)對(duì)象。
舉個(gè)例子:
var obj = {
value: 1
};
function foo(o) {
o.value = 2;
console.log(o.value); //2
}
foo(obj);
console.log(obj.value) // 2
哎,不對(duì)啊,連我們的紅寶書都說(shuō)了 ECMAScript 中所有函數(shù)的參數(shù)都是按值傳遞的,這怎么能按引用傳遞成功呢?
而這究竟是不是引用傳遞呢?
第三種傳遞方式
不急,讓我們?cè)倏磦€(gè)例子:
var obj = {
value: 1
};
function foo(o) {
o = 2;
console.log(o); //2
}
foo(obj);
console.log(obj.value) // 1
如果 JavaScript 采用的是引用傳遞,外層的值也會(huì)被修改吶,這怎么又沒(méi)被改呢?所以真的不是引用傳遞嗎?
這就要講到其實(shí)還有第三種傳遞方式,叫按共享傳遞。
而共享傳遞是指,在傳遞對(duì)象的時(shí)候,傳遞對(duì)象的引用的副本。
注意: 按引用傳遞是傳遞對(duì)象的引用,而按共享傳遞是傳遞對(duì)象的引用的副本!
所以修改 o.value,可以通過(guò)引用找到原值,但是直接修改 o,并不會(huì)修改原值。所以第二個(gè)和第三個(gè)例子其實(shí)都是按共享傳遞。
最后,你可以這樣理解:
參數(shù)如果是基本類型是按值傳遞,如果是引用類型按共享傳遞。
但是因?yàn)榭截惛北疽彩且环N值的拷貝,所以在高程中也直接認(rèn)為是按值傳遞了。
所以,高程,誰(shuí)叫你是紅寶書嘞!
深入系列
JavaScript深入系列目錄地址: https://github.com/mqyqingfeng/Blog 。
JavaScript深入系列預(yù)計(jì)寫十五篇左右,旨在幫大家捋順JavaScript底層知識(shí),重點(diǎn)講解如原型、作用域、執(zhí)行上下文、變量對(duì)象、this、閉包、按值傳遞、call、apply、bind、new、繼承等難點(diǎn)概念。
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
在多個(gè)頁(yè)面使用同一個(gè)HTML片段的代碼
有一個(gè)比較復(fù)雜的HTML片段(A),如果把這個(gè)HTML片段嵌入到其他頁(yè)面中(B,C,D....)。 問(wèn)題的關(guān)鍵是在HTML片段中有大量的JavaScript邏輯需要處理,比如說(shuō)分頁(yè),點(diǎn)擊事件響應(yīng)等。2011-03-03
Bootstrap Modal對(duì)話框如何在關(guān)閉時(shí)觸發(fā)事件
這篇文章主要為大家詳細(xì)介紹了Bootstrap Modal對(duì)話框如何在關(guān)閉時(shí)觸發(fā)事件,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-12-12
javascript刪除數(shù)組元素并且數(shù)組長(zhǎng)度減小的簡(jiǎn)單實(shí)例
本篇文章主要是對(duì)javascript刪除數(shù)組元素并且數(shù)組長(zhǎng)度減小的簡(jiǎn)單實(shí)例進(jìn)行了介紹,需要的朋友可以過(guò)來(lái)參考下,希望對(duì)大家有所幫助2014-02-02
微信小程序 自定義彈窗實(shí)現(xiàn)過(guò)程(附代碼)
這篇文章主要介紹了微信小程序 自定義彈窗實(shí)現(xiàn)過(guò)程(附代碼),文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2019-12-12
javascript 刪除select中的所有option的實(shí)例
這篇文章主要介紹了javascript 刪除select中的所有option的實(shí)例的相關(guān)資料,希望通過(guò)本文能幫助到大家實(shí)現(xiàn)這樣的功能,需要的朋友可以參考下2017-09-09
通過(guò)學(xué)習(xí)bootstrop導(dǎo)航條學(xué)會(huì)修改bootstrop顏色基調(diào)
這篇文章主要介紹了通過(guò)學(xué)習(xí)bootstrop導(dǎo)航條學(xué)會(huì)修改bootstrop顏色基調(diào),需要的朋友可以參考下2017-06-06
Canvas實(shí)現(xiàn)動(dòng)態(tài)的雪花效果
本文主要分享Canvas實(shí)現(xiàn)動(dòng)態(tài)的雪花效果的示例代碼。具有很好的參考價(jià)值,下面跟著小編一起來(lái)看下吧2017-02-02
js實(shí)現(xiàn)帶緩沖效果的仿QQ面板折疊菜單代碼
這篇文章主要介紹了js實(shí)現(xiàn)帶緩沖效果的仿QQ面板折疊菜單代碼,通過(guò)JavaScript定時(shí)函數(shù)遞歸調(diào)用實(shí)現(xiàn)折疊菜單的緩沖效果,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-09-09

