javascript - À quoi sert la méthode Clone en JS?

Question

Parfois, lors d'opérations sur des tableaux, la méthode de clonage est utilisée. Je pense qu'il est acceptable d'attribuer des valeurs directement sans utiliser cette méthode. Pour économiser de la mémoire ? Il existe aussi des copies superficielles, des copies profondes, etc., pardonnez-moi d'être novice. .

Answer 1

L'avantage est que contrairement à "=", le tableau clone est indépendant en mémoire, et vous pouvez en faire ce que vous voulez.

En js, les tableaux et les objets sont des types référence.

const arr = [1, 2, 3, 4, 5, 6];
const arr1 = arr; // 直接赋值，arr1指向的是arr的内存，也就是说arr发生改变时，arr1也会被改变
arr.push(123);
console.log(arr1); // [1, 2, 3, 4, 5, 6, 123]

const arr = [1, 2, 3, 4, 5, 6];
const arr1 = arr.slice(0); // 克隆了一个arr1，arr与arr1指向不同的内存，arr的改变并不会影响到arr1
arr.push(123);
console.log(arr1); // [1, 2, 3, 4, 5, 6]

Ainsi, la fonction du clonage est de générer une nouvelle copie des données sans contaminer les données d'origine.

Quant à la copie profonde et à la copie superficielle :

const obj1 = {
    name: 'Ash',
    class: {
        a: 1,
        b: 2,
    }
};

// 浅拷贝
const obj2 = {};
for (let key in obj1) {
    obj2[key] = obj1[key];
}

// 深拷贝
const copyObj = (obj) => {
    const newObj = {};
    for (let key in obj) {
        if (typeof obj[key] !== 'object') {
            newObj[key] = obj[key];
        } else {
            newObj[key] = copyObj(obj[key]);
        }
    }
    return newObj;
}
const obj3 = copyObj(obj1);

obj1.name = 'Coco';
obj1.class.a = 100;
console.log(obj2.name, obj2.class.a); // Ash 100
console.log(obj3.name, obj3.class.a); // Ash 1

Comme vous pouvez le voir, la différence entre la copie superficielle et la copie profonde est que la copie superficielle ne traverse que la première couche d'obj1, puis attribue chaque attribut d'obj1 à obj2, contrairement à la copie profonde, lorsque la valeur de l'attribut est un objet At ; cette fois, la copie complète créera un nouvel objet vide, puis attribuera la valeur de l'objet à l'objet vide, puis renverra l'objet vide comme attribut d'obj3.

Answer 2

Un principe très important dans la programmation JS est"Ne touchez pas les objets qui ne vous appartiennent pas"

Pour te donner une métaphore vivante, je t'ai prêté un livre (objet), et je pensais que tu voulais juste le lire (lire), mais tu l'as utilisé pour pratiquer la calligraphie (écrire). Je ne peux même pas lire le livre quand. vous me le rendez. Contenu normal.

Et deepClone résout ce problème. Je vous donne un livre, vous allez le copier, me rendez le livre tel quel, et vous pouvez disposer de la copie comme vous le souhaitez.

Answer 3

Copie profonde et copie superficielle en javascript ?