Heim  >  Artikel  >  Web-Frontend  >  Was ist die Verwendung von „Assign“ in es6?

Was ist die Verwendung von „Assign“ in es6?

WBOY
WBOYOriginal
2022-05-05 14:25:042599Durchsuche

In es6 wird „Assign“ zum Zusammenführen von Objekten verwendet. Es kann alle aufzählbaren Eigenschaften des Quellobjekts in das Zielobjekt kopieren, wenn das Zielobjekt und das Quellobjekt denselben Namen haben Folgendes Das Attribut überschreibt das vorherige Attribut und die Syntax lautet „Object.assign(...)“

Was ist die Verwendung von „Assign“ in es6?

Die Betriebsumgebung dieses Tutorials: Windows 10-System, ECMAScript Version 6.0, Dell G3-Computer.

Was ist die Verwendung von „assign“ in es6?

Die Object.assign-Methode wird zum Zusammenführen von Objekten verwendet, wobei alle aufzählbaren Attribute (Schlüssel:Wert) des Quellobjekts (Quelle) in das Zielobjekt (Ziel) kopiert werden Zum Beispiel:

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

Hinweis: Wenn das Zielobjekt und das Quellobjekt Attribute mit demselben Namen haben oder mehrere Quellobjekte Attribute mit demselben Namen haben, überschreiben die späteren Attribute die vorherigen Attribute.

Zum Beispiel:

rrree

Wenn es nur einen Parameter gibt, gibt Object.assign den Parameter direkt zurück. Wenn der Parameter kein Objekt ist, wird das Objekt zuerst übertragen und dann zurückgegeben, da null und undefiniert nicht konvertiert werden können an Objekte, wenn diese als Parameter verwendet werden. Es wird ein Fehler gemeldet. Wenn ein Nicht-Objekt-Parameter an der Position des Quellobjekts erscheint (d. h. es ist nicht der erste Parameter), gelten andere Verarbeitungsregeln. Zunächst werden diese Parameter in Objekte umgewandelt. Wenn null oder undefiniert angezeigt wird, wird kein Fehler gemeldet, solange es sich nicht um den ersten Parameter handelt.

Zum Beispiel:

    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}

Andere Wertetypen (z. B. numerische Werte, Zeichenfolgen und boolesche Werte) sind nicht im ersten Parameter enthalten und es wird kein Fehler gemeldet, aber die Zeichenfolge wird in das Zielobjekt kopiert Form eines Arrays, andere Werte werden nicht generiert Wirkung.

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

Wenn das Objekt nur Attribute der ersten Ebene und keine Attribute der zweiten Ebene enthält, ist diese Methode eine tiefe Kopie. Wenn das Objekt jedoch Objekte enthält, ist diese Methode eine flache Kopie nach den Attributen der zweiten Ebene .

Verwenden Sie Rekursion, um Deep Copy zu implementieren.

    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} 并没有发生变化

Verwenden Sie js, um Deep Copy zu implementieren

Das obige ist der detaillierte Inhalt vonWas ist die Verwendung von „Assign“ in es6?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel:Warum es6 in es5 konvertieren?Nächster Artikel:Warum es6 in es5 konvertieren?