JavaScript對(duì)象引用與賦值實(shí)例詳解
本文實(shí)例講述了JavaScript對(duì)象引用與賦值。分享給大家供大家參考,具體如下:
<script type="text/javascript"> //例子一: 引用 var myArrayRef = new Array(0,1,2); //創(chuàng)建數(shù)組對(duì)象 var mySeconArrayRef = myArrayRef; // 對(duì)象復(fù)制. myArrayRef[0] = 100; // 修改元素值 alert(mySeconArrayRef[0]); /** * 輸出 100; 學(xué)過其它語言的都應(yīng)該知道這里應(yīng)該輸出的是0 為什么輸出的是100呢? * 上面程序通過把myArrayRef對(duì)象復(fù)制給了mySeconArrayRef這時(shí)就存在了2個(gè)獨(dú)立的 但最初值是相同的對(duì)象 * 因?yàn)槭仟?dú)立的為什么修改myArrayRef會(huì)對(duì)別一個(gè)對(duì)象有影響呢?大家都知道只有當(dāng)他們引用的是同一個(gè)對(duì)象時(shí)這時(shí)修改一個(gè)才會(huì) * 對(duì)別一個(gè)產(chǎn)生影響.但是在javascript語言中創(chuàng)建的對(duì)象myArrayRef值中其時(shí)保存的是對(duì)象的引用(也就是一個(gè)地址). * 也就是 我用 new Array生成的保存在內(nèi)存中而new Array把它所在的地方告訴了myArrayRef,myArrayRef又把這地址告訴了mySeconArrayRef * 他們兩個(gè)都指向的是new Array生成對(duì)象的地址而不是把對(duì)象保存在myArrayRef中,所以通過其中的一個(gè)去修改值時(shí)其時(shí)是修改他們同指象的那對(duì)象. */ alert(mySeconArrayRef[0] ); //例子二: 賦值 var myVa = 'ABC'; //把ABC的值 賦予了myVa var myVb = myVa; // myVa 賦值給 myVb myVa = 'DEF'; //修改myVa /** * 輸出的是:ABC. 因?yàn)槭前阎当4嬖诹俗兞苛?而不是保存的是引用地址,所以他們兩個(gè)是相對(duì)獨(dú)立的整體. */ alert(myVb); </script>
如果真要復(fù)制對(duì)象互不影響,則要通過轉(zhuǎn)換賦值或者遍歷key:value來復(fù)制你中的方法和屬性。
注意:對(duì)象的子對(duì)象也是引用,所以遍歷賦值的時(shí)候要判斷,子元素是否是對(duì)象,如果子元素是對(duì)象,則繼續(xù)對(duì)子元素進(jìn)行遍歷賦值。
轉(zhuǎn)換賦值方式:
var data = {a:1,b:2,c:3,d:[0,1,2,3]};
var str = JSON.stringify(data);
var data1 = $.parseJSON(str); //$為jQuery對(duì)象需要引入jQuery包
data1["e"] = 4;
data1["d"][0] = 11;
console.log(data);
console.log(data1);
輸出結(jié)果:
{a: 1, b: 2, c: 3, d: [0,1,2,3]}
{a: 1, b: 2, c: 3, d: [11,1,2,3], e: 4}
相互沒有影響
當(dāng)對(duì)象引用做為函數(shù)參數(shù)傳遞時(shí)候,依然會(huì)相互影響,切記,如下示例:
var data = {a:1,b:2,c:3,d:{q:4,w:5,e:6}};
var data1 = data;
function con(data2){
data2["r"] = 5;
console.log(JSON.stringify(data2));
}
con(data1);
console.log(JSON.stringify(data));
輸出結(jié)果:
{"a":1,"b":2,"c":3,"d":{"q":4,"w":5,"e":6},"r":5}
{"a":1,"b":2,"c":3,"d":{"q":4,"w":5,"e":6},"r":5}
對(duì)象引用賦值后,如果將對(duì)象置空,相互間是不受影響的,如下:
var arr = {"a":"1","b":"2"};
var arr1 = arr;
arr = {};
arr["a"] = 2;
console.log(arr1);
console.log(arr);
輸出結(jié)果:
{"a":"1","b":"2"},{"a":2}
更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專題:《javascript面向?qū)ο笕腴T教程》、《JavaScript錯(cuò)誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學(xué)運(yùn)算用法總結(jié)》
希望本文所述對(duì)大家JavaScript程序設(shè)計(jì)有所幫助。
相關(guān)文章
解決JS浮點(diǎn)數(shù)運(yùn)算出現(xiàn)Bug的方法
解決JS浮點(diǎn)數(shù)運(yùn)算出現(xiàn)Bug的方法,需要的朋友可以參考一下2013-03-03
JavaScript this調(diào)用規(guī)則說明
我希望通過這些來使你們理解各種函數(shù)調(diào)用方式的不同,讓你的JavaScript代碼遠(yuǎn)離bugs。2010-03-03
js下獲得客戶端操作系統(tǒng)的函數(shù)代碼(1:vista,2:windows7,3:2000,4:xp,5:2003,6:20
有時(shí)候需要在客戶端獲取操作系統(tǒng)的版本,以便更好的給用戶合適的信息,提高用戶體驗(yàn),好不容易從網(wǎng)站發(fā)現(xiàn)了這段代碼,分享給大家。2011-10-10
Bootstrap Metronic完全響應(yīng)式管理模板之菜單欄學(xué)習(xí)筆記
這篇文章主要介紹了Bootstrap Metronic完全響應(yīng)式管理模板之菜單欄學(xué)習(xí)筆記,感興趣的小伙伴們可以參考一下2016-07-07
前端html2canvas生成截圖實(shí)現(xiàn)步驟與踩坑記錄
這篇文章主要介紹了前端html2canvas生成截圖實(shí)現(xiàn)步驟與踩坑的相關(guān)資料,主要步驟包括使用html2canvas生成截圖以及處理圖片跨域和CSS樣式丟失問題,可選方案包括轉(zhuǎn)換圖片為base64編碼和使用domtoimage插件,需要的朋友可以參考下2024-09-09

