A quoi sert assign dans es6

Dans es6, assign est utilisé pour fusionner des objets. Il peut copier toutes les propriétés énumérables de l'objet source vers l'objet cible ; si l'objet cible et l'objet source ont le même nom, ou si plusieurs objets source ont le même nom, alors l'attribut suivant écrasera l'attribut précédent, et la syntaxe est "Object.assign(...)"

L'environnement d'exploitation de ce tutoriel : système Windows 10, ECMAScript version 6.0, ordinateur Dell G3.

À quoi sert assign dans es6 ?

La méthode Object.assign est utilisée pour fusionner des objets, en copiant tous les attributs énumérables (clé:valeur) de l'objet source (source) vers l'objet cible (cible)

Par exemple :

        const target = { a : 1 };
        const  source1 = { b: 2 };
        const  source2 = { c: 3 };
Object.assign(target,source1,source2)      // target { a:1, b:2, c:3 }

Remarque : Si l'objet cible et l'objet source ont des attributs portant le même nom, ou si plusieurs objets sources ont des attributs portant le même nom, les attributs suivants écraseront les attributs précédents.

Par exemple :

    const target  = {a:1,b:1};
    const source1 = { b: 2,c:2};
    const source2 = {c:3};
 Object.assign(target,source1,source2); // target {a:1,b:2,c:3}

S'il n'y a qu'un seul paramètre, Object.assign renverra directement le paramètre. Si le paramètre n'est pas un objet, l'objet sera d'abord transféré puis renvoyé puisque null et indéfini ne peuvent pas être convertis. aux objets, s'ils sont utilisés comme paramètres Une erreur sera signalée. Si un paramètre non-objet apparaît à la position de l'objet source (c'est-à-dire qu'il ne s'agit pas du premier paramètre), alors les règles de traitement sont différentes. Tout d'abord, ces paramètres seront convertis en objets. Si null ou undefined apparaît, tant qu'il ne s'agit pas du premier paramètre, aucune erreur ne sera signalée.

Par exemple :

   const obj = {a:1},
   Object.assign(obj)  === obj   // true   
   typeof  Object.assign(2)    // object
   Object.assign(undefined)  // 报错
   Object.assign(null)   // 报错
   Object.assign(obj,undefined)

Les autres types de valeurs (c'est-à-dire les valeurs numériques, les chaînes et les valeurs booléennes) ne sont pas dans le premier paramètre, et aucune erreur ne sera signalée, mais la chaîne sera copiée dans l'objet cible dans le forme d'un tableau, et les autres valeurs ne seront pas générées. Effet.

    const v1 = 'abc';
    const v2 = true;
    const v3 = 10;
    const objCurrent = Object.assign({},v1,v2,v3);  // {0:'a',1:'b',2:'c'}; 
    // 上面代码中,v1,v2,v3分别是字符串、布尔值、数值，结果只有字符串符合目标对象（以字符串数组的形式），数值与布尔值都会被忽略。这是因为只有字符串的包装对象，会产生枚举属性。
Object.assign()的深浅拷贝问题
    const obj1 = {a: 1};
    const obj2 = {b: 2};
    const obj3 = {c: 3};
    const obj = Object.assign(obj1,obj2,obj3);
    console.log(obj);   //  {a:1,b:2,c:3}
    console.log(obj1);   //   {a:1,b:2,c:3}  原始对象也被改变啦
    const v1 ={a:1},
    const currentObj = Object.assign(JSON.parse(JSON.stringify(v1)),{e:2})
    console.log(currentObj)  // {a:1,e:2}
    console.log(v1) // {a:1} 并没有发生变化

Lorsque l'objet n'a que des attributs de premier niveau et aucun attribut de deuxième niveau, cette méthode est une copie complète. Cependant, lorsqu'il y a des objets dans l'objet, cette méthode est une copie superficielle après les attributs de deuxième niveau.

Utilisez la récursivité pour implémenter la copie profonde

    // _deep 深度拷贝的方法
    function  _deep(source){
        let  target;
        if (typeof source === 'object'){
            // 判断目标值是数组还是对象
            target = Array.isArray(source) ? []: {}
            for (let key in source) {
                // 指示对象自身属性中是否含有指定的属性
                if(source.hasOwnProperty[key]){
                      // 如果属性不是对象则赋值，负责递归
                      if(typeof source[key] !== 'object'){
                            target[key] = source[key]
                      }else {
                            target[key] = _deep(source[key])
                      }
                }
            }
        } else {
           target = source
        }
        // 返回目标值
        return  target 
    }

Utilisez js pour implémenter la copie profonde

    function _deepJs(_data){
        return JSON.parse(JSON.stringify(_data));
    }

[Recommandations associées : tutoriel vidéo javascript, front-end web]

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!