浅拷贝，深拷贝

时间 2019-11-18

标签拷贝繁體版

原文原文链接

拷贝

赋值

基本数据类型=> 赋值，赋值以后，两个变量互不影响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 数据类型、赋值、深拷贝和浅拷贝递归