淺拷貝
只拷貝第一層的值，其他后面拷貝的是地址，
示例
使用u盤在一臺電腦上拷貝檔案，使用淺拷貝拷貝的相當于快捷方式，
第一層兩個內容不一樣，其他每層都是指向同一個檔案
實作淺拷貝的方法
Object.assign (實作淺拷貝)
let obj = { user:{ name: " jack" } } //assign實作淺拷貝 let copyObj = Object.assign({},obj) copyObj.user.name = 'tom' console.log(obj.user.name); console.log(copyObj.user == obj.user);//true
Array.prototype.concat
let arr = [ {name:'jack'} ] //利用concat方法實作對應的淺拷貝 let copyArr = arr.concat() console.log(arr[0] == copyArr[0]); console.log(copyArr == arr); //false
Array.prototype.slice
//slice 截取方法 let sliceArr = arr.slice(0) console.log(arr[0] == sliceArr[0]); console.log(sliceArr == arr); //false...
...擴展運算子實作
//開辟一個新的變數 let newArr = [...arr] console.log(newArr[0] == arr[0]); console.log(newArr == arr); //false
使用第三方的插件 lodash.js _.clone方法實作
//實作淺拷貝 let obj1 = { user:{ name: " jack" } } let copyObj1 = _.clone(obj1) console.log(copyObj1.user == obj1.user);//true console.log(copyObj1 == obj1);//false
深拷貝
每層都進行值拷貝
示例
使用u盤在一臺電腦上拷貝檔案，將檔案所有復制一份，在粘貼一份，這倆份檔案除了值是一致的，其
他都不一樣，倆者的地址是獨立的，
實作方式
使用字串轉換（序列化 JSON.stringify 和反序列化 JSON.parse）
let obj = { users:[{ name: ' jack' }] } //每層都只拷貝值 每層的地址都不一樣 // 字串轉換 序列化和反序列化 let copyObj = JSON.parse(JSON.stringify(obj)) console.log(copyObj == obj); //false console.log(copyObj.users == obj.users); //false console.log(copyObj.users[0] == obj.users[0]); //false console.log(copyObj.users[0].name == obj.users[0].name); //true
使用lodash 里面_.cloneDeep
//使用第三方lodash _.cloneDeep方法實作 let cloneObj = _.cloneDeep(obj) console.log(cloneObj == obj); //false console.log(cloneObj.users == obj.users); //false console.log(cloneObj.users[0] == obj.users[0]); //false console.log(cloneObj.users[0].name == obj.users[0].name); //true
使用遞回實作對應的深拷貝（面試題）
思路
-
根據傳入的物件 進行判斷 如果不是物件直接賦值
-
如果是物件就要先創建一個物件 那么就需要判斷是陣列還是物件 如果是陣列創建陣列 如果是物件就創建物件
-
如果是陣列獲或者是物件 取出里面的值進行遞回賦值
function deepClone(target) { //如果傳入的目標物件是空就直接回傳 if (!target) return {} let copyObj = {} //接收拷貝好的物件 //根據typeOf的回傳值進行判斷 判斷是否為物件 if (typeof target == 'object') { //判斷是否為陣列 copyObj = target instanceof Array ? [] : {} //遍歷所有的key加入到對應的copyObj里面 for (let key in target) { //將對應的值和key加入到對應的copyObj里面 copyObj[key] = deepClone(target[key]) } } else { copyObj = target //直接賦值 } return copyObj }
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/502880.html
標籤：其他
上一篇：Js-字串
下一篇：JS-陣列