淺拷貝,深拷貝

拷貝

賦值

基本數據類型=> 賦值,賦值以後,兩個變量互不影響html

eg: var a=1 b=a  console.log(b) // 1  a=2 console.log(b) //1

引用數據類型=> 賦址,僅改變引用的指針,指向同一個對象,因此相互之間有影響json

eg: var obj={a:"1" ,b:"2" }  var obj1=obj console.log(obj1) // {a:"1" ,b:"2" } obj.a=3  obj.b=4 console.log(obj1) // {a: 3, b: 4}

淺拷貝

從新在堆中建立內存,拷貝先後對象的基本數據類型互不影響,只拷貝一層,不能對對象的子對象進行拷貝
典型的淺拷貝方法 Object.assign()數據結構

eg:var obj={a:1,b:2} obj1=new Object()  Object.assign(obj1, obj)  obj.a=3  console.log(obj1) //{a:1,b:2}  obj1.a=4 console.log(obj) //{a:1,b:2}

淺拷貝方法函數

var obj={a:'hello',b:{ c:'world' }} 
var obj1=obj
function copyObj(obj){
   let qkb={}
    for(var key in obj){
        if(obj.hasOwnProperty(key)){
            obj1[key]=obj[key]
        }
    }
    return qkb;
}

var obj2= copyObj(obj)
obj.a="haha"
obj.b.c="wo"
console.log(obj1) // {a:'haha',b:{ c:'wo' }} 
console.log(obj2) //{a:'hello',b:{ c:'wo' }}

ob1只是將指針改變,引用的仍然是同一個對象,而淺拷貝獲得的obj2建立了新對象,可是,原對象obj的子對象,則不會對這個子對象淺拷貝,而只是複製其對象的變量地址指針

深拷貝

=>對對象中的子對象進行遞歸拷貝,拷貝先後的兩個對象,互不影響code

1>深拷貝方法 JSON.parse(JSON.stringify(obj))htm

var obj = {a: {b: 1}}
var copy = JSON.parse(JSON.stringify(obj))

obj.a.b = 2
console.log(obj) // {a: {b: 2}}
console.log(copy) // {a: {b: 1}}

可是 JSON.parse()、JSON.stringify也存在一個問題,JSON.parse()和J SON.stringify()能正確處理的對象只有Number、String、Array等可以被 json 表示的數據結構,所以函數這種不能被 json 表示的類型將不能被正確處理。對象

var target = {
    a: 1,
    b: 2,
    hello: function() { 
            console.log("Hello, world!");
    }
};
var copy = JSON.parse(JSON.stringify(target));
console.log(copy);   // {a: 1, b: 2}
console.log(JSON.stringify(target)); // "{"a":1,"b":2}"

2> 遍歷實現屬性複製blog

function deepCopy (source) {
  var target
  if (typeof source === 'object') {
    target = Array.isArray(source) ? [] : {}
    for (var key in source) {
      if (source.hasOwnProperty(key)) {
        if (typeof source[key] !== 'object') {
          target[key] = source[key]
        } else {
          target[key] = deepCopy(source[key])
        }
      }
    }
  } else {
    target = source
  }
  return target
}

var obj1 = {a: {b: 1}}
var cpObj1 = deepCopy(obj1)
obj1.a.b = 2
console.log(cpObj1) // {a: {b: 1}}

var obj2 = [[1]]
var cpObj2 = deepCopy(obj2) 
obj2[0][0] = 2
console.log(cpObj2) // [[1]]

參考資料

JS 數據類型、賦值、深拷貝和淺拷貝遞歸

相關文章
相關標籤/搜索