深拷贝和浅拷贝

浅拷贝

将一份数据拷贝到另外一个变量中, 修改第一层数据时不会互相影响, 但是修改第二层数据时会互相影响

如果浅拷贝 只有一层的话 就相当于深拷贝

赋值和浅拷贝的区别

对原始数据的影响
	和元数据是否指向同一对象	第一层数据基本数据类型	原数据包含子对象（引用数据类型）
赋值	是	赋值后的数据改变，会使原来数据一同改变	赋值后的数据改变，会使原数据一同改变
浅拷贝	否	浅拷贝后的数据改变，不会使原数据一同改变	浅拷贝后的数据改变，会使原数据一同改变

浅拷贝实现 注意：当拷贝对象只有一层的时候，是深拷贝

• 1.展开运算符...
• 2.Object.assign()
• 3.Array.prototype.concat()
• 4.Array.prototype.slice()

深拷贝

深拷贝实现(手写递归)

第一种

let obj = {
  name:'张三',
  age:18,
  info:{
    gao:100,
    kuan:200
  }
}
let newObj = {}
//两个参数 yuan newobj
//核心 把每一项包括引用类型内部的 都遍历一遍 拷贝一份给新的
function deepClone(newobj,yuan){
    for(let key in yuan){
      if(Object.prototype.toString.call(yuan[key]) === '[object Object]'){
        newobj[key] = {}
        deepClone(newobj[key],yuan[key])
      }else if(Object.prototype.toString.call(yuan[key]) === '[object Array]'){
        newobj[key] = []
        deepClone(newobj[key],yuan[key])
      }else{
        newobj[key] = yuan[key]
      }
    }
}
deepClone(newObj,yuan)
console.log(newObj)

第二种

// 检测数据类型的功能函数
const checkedType = (target) => Object.prototype.toString.call(target).replace(/\[object (\w+)\]/, "$1").toLowerCase();
// 实现深拷贝（Object/Array）
const clone = (target) => {
    let result;
    let type = checkedType(target);
    if(type === 'object') result = {};
    else if(type === 'array') result = [];
    else  return target;
    for (let key in target) {
        if(checkedType(target[key]) === 'object' || checkedType(target[key]) === 'array') {
            result[key] = clone(target[key]);
        } else {
            result[key] = target[key]; 
        }
    }
    return result;
}

调用一下手写递归实现深拷贝方法

const obj = {
    name: 'Chen',
    detail: {
        age: '18',
        height: '180',
        bodyWeight: '68'
    },
    hobby: ['see a film',  'write the code',  'play basketball', 'tourism']
}

const obj1 = clone(obj);
console.log(obj1); // { name: 'Chen',detail: { age: '18', height: '180', bodyWeight: '68' },  hobby: [ 'see a film', 'write the code', 'play basketball', 'tourism' ]}
console.log(obj1 === obj); // false

深拷贝实现(方法实现)

JSON.parse(JSON.stringify())

JQuery.extend()方法 需要引用jq