js深拷貝的幾種方式

1、利用json

var obj = {
  name: "test",
  desc: "origin"
}

function deepCopy(obj) {
  var a = JSON.stringify(obj)
  var newobj = JSON.parse(a)
  return newobj
}

var obj2 = obj    // 淺拷貝
var obj3 = deepCopy(obj)  // 深拷貝

obj.name = "change"

console.log(obj2) // { desc: "origin", name: "change" }
console.log(obj3) // { desc: "origin", name: "test" }


// 該種方法只能拷貝 value無 function 類型的

 

2、利用Object.assin()

var obj = {
  name: "test",
  desc: "origin"
}

var obj2 = Object.assign(obj)

obj.name = "change"
console.log(obj2)  // { name: "change", desc: "origin" }

// 當對象里只有一級屬性時可以這么寫， 二級的時候就變成淺拷貝了

 

3、利用遞歸

var obj = {
  name: "test",
  desc: "origin",
  sendobj: {
    name: "test2",
    desc: "origin2"
  }
}

function copy(obj) {
  let newobj = null     // 接受拷貝的新對象
  if(typeof(obj) == 'object' && typeof(obj) !== null) {   // 判斷是否是引用類型
    newobj = obj instanceof Array? []: {}               // 判斷是數組還是對象
    for(var i in obj) {   
      newobj[i] = copy(obj[i])                        // 判斷下一級是否還是引用類型
    } 
  } else {
    newobj = obj
  }
  return newobj
}

var obj1 = copy(obj)

obj.sendobj.name = "change"
console.log(obj1)
/*
desc: "origin"
name: "test"
sendobj: {
  desc: "origin2"
  name: "test2"
}
*/