js copia profunda manuscrita

Copia profunda manuscrita de JS

Copia profunda: Supongamos que tengo un objeto A, se lo asigno a B, no importa cómo cambie B, A no cambiará, es decir, copia profunda

Copia superficial: supongamos que tengo un objeto anidado A, lo asigno a B, cambio el objeto anidado en B, A cambiará en consecuencia y cambiaré el atributo A de la primera capa sin cambiarlo, eso es copia superficial.

Hay muchos dichos en Internet de que los métodos de división y concatenación de matrices se pueden usar para matrices, o que los objetos se pueden copiar en profundidad usando Object.assign() y los operadores de extensión ES6 (...) Los objetos son útiles, pero tienen varias capas. el anidamiento no funciona. ¿Qué es el anidamiento multicapa? Lo siguiente son dos capas. El nombre del atributo del objeto obj también es un objeto, y también se puede anidar infinitamente. El método anterior es aplicable al siguiente anidamiento multicapa es inútil .

var obj = { edad: 13, nombre: { dirección: 'cielo' } }

Los dos métodos siguientes implementan la copia en profundidad, independientemente de si se trata de un objeto de capa o de varias capas.

El primero: método de daño cerebral

function deepClone(obj) {
    
    
    if(typeof obj != 'object') return obj;
    return JSON.parse(JSON.stringify(obj))
}

// 测试
var obj = {
    
    
    name: 123
}
var obj1 = obj;
obj1.name = 345;
console.log(obj.name); // 345 这里看到 我们把obj赋值给obj1 然后修改obj1的name值，obj的name值同样发生了改变
var obj2 = deepClone(obj);
obj2.name = 678
console.log(obj.name); //345 把obj赋值给obj2 然后修改obj2的name值 obj的值不发生改变

El método de daño cerebral anterior es simple y crudo, pero tiene un defecto:

function deepClone(obj) {
    
    
        if (typeof obj != 'object') return obj;
        return JSON.parse(JSON.stringify(obj))
    }
    // 测试
    var obj = {
    
    
        name: 123
    }
    obj.test = obj
    var obj1 = obj;
    var obj2 = deepClone(obj);

Si hay una referencia a sí mismo, obj tiene un atributo llamado test, y su valor es obj mismo. En este momento, se informa un error. El error es el siguiente, lo que indica que la premisa de usar JSON.parse (JSON.stringify (obj)) es que el objeto no puede tener una referencia a sí mismo

El segundo método: método recursivo

function deepClone(obj) {
    
    
    if (typeof obj != 'object') return obj;
    var temp = Array.isArray(obj) ? [] : {
    
    };
    for (let key in obj) {
    
    
        if (obj.hasOwnProperty(key)) {
    
    
            if (obj[key] && typeof obj[key] == 'object') {
    
     // 如果obj[key]还是对象则执行递归
                temp[key] = deepClone(obj[key]); // 递归
            } else {
    
    
                temp[key] = obj[key];
            }
        }
    }
    return temp;
}

var obj = {
    
    
    age: 13,
    name: {
    
    
        addr: '天边'
    }
}

var obj2 = deepClone(obj);
obj2.age = 14
obj2.name.addr = '地心'
console.log(obj.age); //13
console.log(obj.name.addr); //天边