JSON.parse(JSON.stringify())和深复制assign和浅复制

浅复制:

Assign 实现:res != obj
	

JSON.parse(JSON.stringify())和深复制assign和浅复制_第1张图片

原生Js 实现, 等同于Assign

const shallowCopy = (Sobj) => {
    // 判断是否为对象,如果不是直接返回
    if (typeof Sobj !== 'object') return
    // 判断接受的参数是否是Array ,如果是, 则定义的新newObj 则是数组,反之 则为对象
    let newObj = Sobj instanceof Array ? [] : {}
    // 对接收的参数进行遍历,只会遍历可枚举属性, hasOwnProperty 方法判断属性是否存在
    for (let key in Sobj) {
        if (Sobj.hasOwnProperty(key)) {
            newObj[key] = Sobj[key]
        }
    }
    return newObj
}
let obj = {
    a: 1,
    arr: [2, 3]
};

// let res = shallowCopy(obj);
console.log(res.arr === obj.arr); // true,指向同一个引用
console.log(res.a === obj.a); // false

JSON.parse(JSON.stringify())和深复制assign和浅复制_第2张图片

深复制: 等同于JSON.parse(JSON.stringify())

 const deepCopy = (sourceObj) => {
    if (typeof sourceObj !== 'object') return
    let newObj = sourceObj instanceof Array ? [] : {}

    for (let key in sourceObj) {
        if (sourceObj.hasOwnProperty(key)) {
            newObj[key] = (typeof sourceObj[key] === 'object' ? deepCopy(sourceObj[key]) : sourceObj[key])
        }
    }
    return newObj
} 
let obj = {
    a: 1,
    arr: [2, 3]
};
let res = deepCopy(obj);
console.log(res.arr === obj.arr); // false,指向不同的引用
console.log(res === obj); // false

JSON.parse(JSON.stringify())和深复制assign和浅复制_第3张图片

JSON.parse(JSON.stringify())实现: 两个都不相等

JSON.parse(JSON.stringify())和深复制assign和浅复制_第4张图片

你可能感兴趣的:(原生Js)