這篇文章給大家分享的是有關(guān)javascript中深拷貝與淺拷貝的示例分析的內(nèi)容。小編覺(jué)得挺實(shí)用的，因此分享給大家做個(gè)參考，一起跟隨小編過(guò)來(lái)看看吧。
創(chuàng)新互聯(lián)建站是一家專(zhuān)業(yè)從事做網(wǎng)站、成都網(wǎng)站制作、網(wǎng)頁(yè)設(shè)計(jì)的品牌網(wǎng)絡(luò)公司。如今是成都地區(qū)具影響力的網(wǎng)站設(shè)計(jì)公司,作為專(zhuān)業(yè)的成都網(wǎng)站建設(shè)公司,創(chuàng)新互聯(lián)建站依托強(qiáng)大的技術(shù)實(shí)力、以及多年的網(wǎng)站運(yùn)營(yíng)經(jīng)驗(yàn),為您提供專(zhuān)業(yè)的成都網(wǎng)站建設(shè)、營(yíng)銷(xiāo)型網(wǎng)站建設(shè)及網(wǎng)站設(shè)計(jì)開(kāi)發(fā)服務(wù)！
深拷貝和淺拷貝是大家經(jīng)常聽(tīng)到的兩個(gè)名詞，兩者到底有什么不同呢？
先看看什么是淺拷貝。
重慶分公司
重慶分公司
var obj1 = { a: 1, b: 2 };
var obj2 = obj1;
obj2.a = 3;
console.log(obj1); // { a: 3, b: 2 }
console.log(obj2); // { a: 3, b: 2 }這是一個(gè)最簡(jiǎn)單的淺拷貝的例子，我把obj1賦值給obj2，改變了obj2中的一個(gè)屬性值，obj1中的相應(yīng)屬性值也跟著變化了，這是為什么呢？
因?yàn)?strong>淺拷貝其實(shí)只是引用的拷貝，兩者還是指向內(nèi)存中的同一個(gè)地址。簡(jiǎn)而言之，就是obj1和obj2其實(shí)指向的是同一個(gè)對(duì)象。打個(gè)比方，就像一個(gè)房間把門(mén)牌號(hào)1換成了門(mén)牌號(hào)2，但是這個(gè)房間還是這個(gè)房間。
那深拷貝就是兩者指向不同的內(nèi)存地址，是真正意義上的拷貝。拿上面的房間舉例子，就是你真的重新開(kāi)了一間房，并不是只是換門(mén)牌號(hào)。
Object.assign()是我們經(jīng)常用到的方法，其實(shí)這個(gè)方法就是淺拷貝。但是它又有一點(diǎn)特殊的地方，就是可以處理第一層的深拷貝。
var obj1 = { a: 1, b: { c: 2 } };
var obj2 = Object.assign({}, obj1);
obj2.a = 3;
obj2.b.c = 3;
console.log(obj1); // { a: 1, b: { c: 3 } }
console.log(obj2); // { a: 3, b: { c: 3 } }看上面的例子，屬性a的值并沒(méi)有跟著變，但是屬性b中的c的值跟著變了。
這是最常用的實(shí)現(xiàn)深拷貝的方式，直接看例子：
var obj1 = { a: { b: 1 } };
var obj2 = JSON.parse(JSON.stringify(obj1));這種方法很簡(jiǎn)單而且好用，但是有一點(diǎn)點(diǎn)瑕疵，它會(huì)拋棄對(duì)象的constructor。也就是深拷貝之后，不管這個(gè)對(duì)象原來(lái)的構(gòu)造函數(shù)是什么，在深拷貝之后都會(huì)變成Object。
而且這種方法能正確處理的對(duì)象只有 Number, String, Boolean, Array，即那些能夠被JSON直接表示的數(shù)據(jù)結(jié)構(gòu)。RegExp對(duì)象或者function是無(wú)法通過(guò)這種方式深拷貝。
這是我個(gè)人目前使用的方法，只需要一行var obj2 = _.cloneDeep(obj1)就能實(shí)現(xiàn)。而且lodash是一個(gè)功能很強(qiáng)大的庫(kù)，提供的方法可靠又簡(jiǎn)單，
感謝各位的閱讀！關(guān)于“javascript中深拷貝與淺拷貝的示例分析”這篇文章就分享到這里了，希望以上內(nèi)容可以對(duì)大家有一定的幫助，讓大家可以學(xué)到更多知識(shí)，如果覺(jué)得文章不錯(cuò)，可以把它分享出去讓更多的人看到吧！
