Explication détaillée des exemples de devoirs de déstructuration pour l'apprentissage ES6

1. La définition de l'affectation déstructurante

Une compréhension simple est que les côtés gauche et droit de l'affectation = signe ont la même structure pour effectuer un face-à-face. une instruction d'affectation

2. Classification de l'affectation de déstructuration

affectation de déstructuration de tableau affectation de déstructuration d'objet affectation de déstructuration de chaîne affectation de déstructuration de valeur booléenne affectation de déstructuration de paramètre de fonction Devoir de déstructuration numérique ( Concentrez-vous simplement sur la compréhension des deux premiers )

3 Expliquez chaque catégorie séparément

1. Affectation de déstructuration de tableau (le code est affiché ci-dessous et les commentaires nécessaires sont ajoutés pour une compréhension facile)

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

　Vous pouvez également définir des valeurs par défaut pour les variables . Par exemple, c dans le code suivant est La valeur par défaut est 3. Si la déstructuration, par exemple, [a,b,c]=[1,2], c n'est pas déconstruit, alors c n'est pas défini

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

　Utiliser le scénario 1

　①, échange variable　

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

　②, extraction directe de la valeur de retour de la fonction (Sans affectation de déstructuration, vous devez d'abord récupérer le résultat puis le récupérer via l'index)

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

　③. Récupérez uniquement certaines valeurs requises du résultat renvoyé

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

　④ Ne vous souciez pas de la longueur du contenu du tableau

{  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. Déstructuration et affectation d'objets

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

L'affectation de déstructuration d'objets définit la valeur par défaut

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

Affectation déstructurante d'objets peu complexes　

{
  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）
}

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!