淺克隆和深克隆的用法

HousLin發表於2020-12-13
淺克隆
定義:拷貝後的新物件的屬性和原物件中的屬性不會關聯,但是方法都指向同一個地址

es6剩餘引數解構
let b = {...obj}

Object.assign(複製方, 被複制方)  返回列舉後的新物件
let b = Object.assign({}, obj);   

slice()切割
let b = obj.slice();  
深克隆
定義:
	拷貝一個新物件出來,但是新物件的地址和原物件的地址不一樣
	任意一方修改資料不會影響另一方,只是剛開始拷貝過去屬性和方法長得一樣

let obj = { n: 1 };    
    
遞迴  (原生)
function Deepclone(obj) {
      let deepObj = Array.isArray(obj) ? [] : {};
      // 1、判斷obj是否為基本資料型別object
      if (obj && typeof obj === 'object') {
        // 2、遍歷物件中的每個屬性
        for (key in obj) {
          if (obj.hasOwnProperty(key)) {
            // 3、判斷obj中的key是否都為基本資料型別object
            if (obj[key] && typeof obj[key] === 'object') {
              // 4、是的話遞迴將每個key插入到deepObj中
              deepObj[key] = Deepclone(obj[key])
            } else {
              // 5、不是的話等於他原來的樣子
              deepObj[key] = obj[key]
            }
          }
        }
      }
      // 6、最後把結果返回出去
      return deepObj
    }
let b = Deepclone(a); // { n: 1 }

外掛lodash
 下載 npm i lodash
 const _ = require('lodash');
 let b = _.cloneDeep(obj);  // { n: 1 }

 JSON.parse和JSON.Stringify
 let b = JSON.parse(JSON.Stringify(obj));  // { n: 1 }

相關文章