摘要:前言關(guān)于深拷貝和淺拷貝其實(shí)是兩個(gè)比較基礎(chǔ)的概念,但是我還是想整理一下,因?yàn)槔锩嬗泻芏嘈〖?xì)節(jié)還是很有意思的。那深拷貝就是兩者指向不同的內(nèi)存地址,是真正意義上的拷貝。談?wù)勈俏覀兘?jīng)常用到的方法,其實(shí)這個(gè)方法就是淺拷貝。
前言
關(guān)于深拷貝和淺拷貝其實(shí)是兩個(gè)比較基礎(chǔ)的概念,但是我還是想整理一下,因?yàn)槔锩嬗泻芏嘈〖?xì)節(jié)還是很有意思的。
深拷貝和淺拷貝的區(qū)別深拷貝和淺拷貝是大家經(jī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è)房間把門牌號(hào)1換成了門牌號(hào)2,但是這個(gè)房間還是這個(gè)房間。
那深拷貝就是兩者指向不同的內(nèi)存地址,是真正意義上的拷貝。拿上面的房間舉例子,就是你真的重新開了一間房,并不是只是換門牌號(hào)。
談?wù)凮bject.assign()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的值并沒有跟著變,但是屬性b中的c的值跟著變了。
常用的實(shí)現(xiàn)深拷貝的方式 JSON這是最常用的實(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ì)象原來的構(gòu)造函數(shù)是什么,在深拷貝之后都會(huì)變成Object。
而且這種方法能正確處理的對(duì)象只有 Number, String, Boolean, Array,即那些能夠被JSON直接表示的數(shù)據(jù)結(jié)構(gòu)。RegExp對(duì)象或者function是無法通過這種方式深拷貝。
lodash這是我個(gè)人目前使用的方法,只需要一行var obj2 = _.cloneDeep(obj1)就能實(shí)現(xiàn)。而且lodash是一個(gè)功能很強(qiáng)大的庫,提供的方法可靠又簡(jiǎn)單,真的是懶人必備,點(diǎn)擊這里去了解它吧!
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://systransis.cn/yun/98510.html
摘要:引用數(shù)據(jù)類型名存在棧內(nèi)存中,值存在于堆內(nèi)存中,但是棧內(nèi)存會(huì)提供一個(gè)引用的地址指向堆內(nèi)存中的值,我們以上面淺拷貝的例子畫個(gè)圖當(dāng)進(jìn)行拷貝時(shí),其實(shí)復(fù)制的是的引用地址,而并非堆里面的值。 如何區(qū)分深拷貝與淺拷貝? 簡(jiǎn)單來說,就是假設(shè)B復(fù)制了A,當(dāng)修改A時(shí),看B是否會(huì)發(fā)生變化,如果B也跟著變了,說明這是淺拷貝,拿人手短,如果B沒變,那就是深拷貝,自食其力。 淺拷貝例子: var a=[0,1...
摘要:中的深拷貝與淺拷貝說到深淺拷貝的時(shí)候就不得不說一下中的變量類型了基本類型按值存放在棧內(nèi)存中的簡(jiǎn)單數(shù)據(jù)段可以直接訪問引用類型存放在堆內(nèi)存中的對(duì)象變量保存的是一個(gè)指向存放數(shù)據(jù)位置的指針訪問引用類型的值時(shí)首先從棧中獲取到存放該數(shù)據(jù)位置的指針然后再 JS中的深拷貝與淺拷貝 說到深淺拷貝的時(shí)候就不得不說一下JS中的變量類型了: 基本類型: undefined、null、boolean、numb...
摘要:期深拷貝與淺拷貝的區(qū)別如何實(shí)現(xiàn)一個(gè)深拷貝在回答這個(gè)問題前,我們先來回顧一下中兩大數(shù)據(jù)類型基本類型引用類型基本類型基本類型就是值類型存放在棧內(nèi)存中的簡(jiǎn)單數(shù)據(jù)段,數(shù)據(jù)大小確定,內(nèi)存空間大小可以分配引用類型引用類型存放在堆內(nèi)存中的對(duì)象,變量實(shí)際保 20190311期 深拷貝與淺拷貝的區(qū)別?如何實(shí)現(xiàn)一個(gè)深拷貝 在回答這個(gè)問題前,我們先來回顧一下JS中兩大數(shù)據(jù)類型 基本類型 Undefined...
摘要:什么是深拷貝淺拷貝見名知義,無論是深拷貝還是淺拷貝,都是的問題。使用如下以上就是關(guān)于中的深拷貝與淺拷貝的知識(shí)和如何進(jìn)行深拷貝的知識(shí)了,如果有錯(cuò)或者有其他方式的話,歡迎在下面留言評(píng)論啦 前言 最近在寫項(xiàng)目的時(shí)候涉及到一些父子組件傳遞個(gè)對(duì)象或者數(shù)組通信啥的,或者是直接復(fù)制添加對(duì)象啥的,直接使用賦值的時(shí)候總會(huì)出錯(cuò)。一查原來是淺拷貝的問題,就從網(wǎng)上找了點(diǎn)資料,匯總到這里來了。 1 什么是深拷貝...
摘要:深拷貝和淺拷貝原始對(duì)象賦值,傳對(duì)象的引用對(duì)象拷貝,淺拷貝對(duì)象拷貝,深拷貝修改對(duì)象修改對(duì)象中的數(shù)組對(duì)象 深拷貝和淺拷貝 import copy a = [1, 2, 3, 4, [a, b]] #原始對(duì)象 b = a #賦值,傳對(duì)象的引用 c = copy.copy(a) #對(duì)象拷貝,淺拷貝 d = copy.deepcopy(a) #對(duì)象拷貝,深拷貝 a...
閱讀 2228·2021-09-22 10:56
閱讀 1526·2021-09-07 10:11
閱讀 1832·2019-08-30 15:54
閱讀 2319·2019-08-30 15:44
閱讀 2333·2019-08-29 12:40
閱讀 3054·2019-08-28 18:25
閱讀 1772·2019-08-26 10:24
閱讀 3217·2019-08-23 18:39