淺拷貝和深拷貝

• 淺拷貝: 只拷貝一層.當(dāng)對象是復(fù)雜數(shù)據(jù)類型(Object、 Array)時(shí),只拷貝引用
• 深拷貝: 多層拷貝.復(fù)雜數(shù)據(jù)類型,會重新分配內(nèi)存空間.

實(shí)現(xiàn)淺拷貝的2種方法

• 使用for ... in 實(shí)現(xiàn)

var obj = {name: 'marron',age: 18,msg: {sex: "1" } } var o = {}; for(let k in obj) {o[k] = obj[k] }; console.log(o);

• 使用es6提供的方法Object.assign

var obj = {name: 'marron',age: 18,msg: {sex: "1"} } var o = {}; Object.assign(o, obj); console.log(o);

上面用實(shí)現(xiàn)了將對象obj賦值給o. 但是,o中對屬性sex的操作.是引用操作.
即改變o.msg.sex屬性obj.msg.sex屬性也會改變.

o.msg.sex = 2; console.log(obj.msg.sex); // 2

實(shí)現(xiàn)深拷貝

很明顯上面并不是我們所需要的結(jié)果.
核心思路是,復(fù)雜數(shù)據(jù)類型賦值時(shí)先開辟內(nèi)存空間.
嘗試使用遞歸實(shí)現(xiàn)拷貝,思路如下:

使用for...in進(jìn)行賦值

在賦值時(shí)首先判斷當(dāng)前的屬性是否為數(shù)組a instanceof Array,若為數(shù)組,則按照數(shù)組方式進(jìn)行遞歸.

在判斷當(dāng)前的屬性是否為對象a instanceof Object

剩下的認(rèn)為是簡單數(shù)據(jù)類型…直接賦值即可

const deepCopy = (newobj, oldobj) => {for(let k in oldobj) {let item = oldobj[k];if(item instanceof Array) {newobj[k] = [];deepCopy(newobj[k], oldobj[k])} else if (item instanceof Object){newobj[k] = {};deepCopy(newobj[k], oldobj[k])} else {newobj[k] = item}} }

• 測試:

let obj = {id: 1,name: 'marron',msg: {age: 18} } let o = deepCopy(o, obj); console.log(o); o.msg.age = 20; console.log(obj);

稍微改進(jìn)一下

• 上面?zhèn)鬟f了2個(gè)參數(shù),且沒有考慮日期和正則的情況
• 改變遞歸出來的條件
• 使用typeof判斷是否是 數(shù)組和對象的形式
• 但是使用 typeof === ‘object’ 會遺漏掉掉null的情況
• 然后使用instanceof來判斷正則和日期的形式

const deepClone = (obj) =>{if(obj === null) return nullif(typeof obj !== 'object') return objif(obj instanceof RegExp){return new RegExp(obj)} if(obj instanceof Date) {return new Date(obj);}let newObj = new obj.constructor;for(let k in obj){if(obj.hasOwnProperty(k)){newObj[k] = deepClone(obj[k])}}return newObj }

總結(jié)

以上是生活随笔為你收集整理的javascript --- 实现对象的深拷贝的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。