Detaillierte Erläuterung der Beispiele für destrukturierende Aufgaben für das ES6-Lernen

1. Die Definition der destrukturierenden Zuweisung

Ein einfaches Verständnis ist, dass die linke und rechte Seite des Zuweisungszeichens die gleiche Struktur haben, um eine Eins-zu- eine Zuweisungsanweisungen

2. Klassifizierung der Destrukturierungszuweisung

Array-Destrukturierungszuweisung Objekt-Destrukturierungszuweisung String-Destrukturierungszuweisung Boolescher Wert-Destrukturierungszuweisung Funktionsparameter-Destrukturierungszuweisung Numerische Destrukturierungsaufgabe ( Konzentrieren Sie sich nur auf das Verständnis der ersten beiden )

3. Erklären Sie jede Kategorie einzeln

1. Zuweisung zur Array-Destrukturierung (der Code wird unten angezeigt und zum besseren Verständnis werden die erforderlichen Kommentare hinzugefügt)

{
  let a,b,rest;
  [a,b]=[1,2];
  console.log(a,b);//输出1,2 直接将1和2解构到a和b}

　Sie können auch Standardwerte für Variablen festlegen . Im folgenden Code ist beispielsweise c Der Standardwert ist 3. Wenn bei der Destrukturierung beispielsweise [a,b,c]=[1,2] c nicht dekonstruiert wird, ist c undefiniert

{
  let a,b,c,rest;
  [a,b,c=3]=[1,2];
  console.log(a,b);}

　Szenario 1 verwenden

　①, variabler Austausch　

{
  let a=1;
  let b=2;
  [a,b]=[b,a];
  console.log(a,b);
}

　②, direkte Extraktion des Funktionsrückgabewerts (Ohne die Zuweisung zu zerstören, müssen Sie zuerst das Ergebnis und dann über den Index abrufen)

{  function f(){return [1,2]
  }
  let a,b;
  [a,b]=f();
  console.log(a,b);
}

　③ Rufen Sie nur einige erforderliche Werte des zurückgegebenen Ergebnisses ab

{  function f(){return [1,2,3,4,5]
  }
  let a,b,c;
  [a,,,b]=f();
  console.log(a,b); // 输出1 4
}

　④ Die Inhaltslänge des Arrays ist egal

{  function f(){return [1,2,3,4,5]
  }
  let a,b,c;
  [a,...b]=f();
  console.log(a,b);//输出1,[2,3,4,5]
}

　2. Objektdestrukturierung und -zuweisung

{
  let o={p:42,q:true};
  let {p,q}=o;
  console.log(p,q);
}

　Objektdestrukturierungszuweisung legt den Standardwert fest

{
  let {a=10,b=5}={a:3};
  console.log(a,b);//输出3 5
}

　Destrukturierende Zuordnung leicht komplexer Objekte　

{
  let metaData={
    title:'abc',
    test:[{
      title:'test',
      desc:'description'}]
  }
  let {title:esTitle,test:[{title:cnTitle}]}=metaData;
  console.log(esTitle,cnTitle);//abc test （相当于esTitle和cnTitle分别对应metaData里面的abc和test）
}

Das obige ist der detaillierte Inhalt vonDetaillierte Erläuterung der Beispiele für destrukturierende Aufgaben für das ES6-Lernen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!