ES6学習用の分解代入例を詳しく解説

零下一度
リリース: 2017-06-26 14:51:13
オリジナル
1643 人が閲覧しました

1. 構造化代入の定義

簡単に理解すると、代入 = 記号の左側と右側は、1 対 1 の代入ステートメントを実行するために同じ構造を持っているということです

2. の分類分割代入

配列分割代入 オブジェクト分割代入 文字列分割代入 ブール値分割代入 関数パラメータ分割代入 数値分割代入 (最初の 2 つの理解に重点を置く)

3 つ目、各カテゴリを個別に説明します

1、配列の分割代入(以下にコードを示し、わかりやすいように必要なコメントを追加しています)

{
  let a,b,rest;
  [a,b]=[1,2];
  console.log(a,b);//输出1,2 直接将1和2解构到a和b}
ログイン後にコピー

変数のデフォルト値を設定することもできます。例えば、以下のコードのcはデフォルトで3になります。 . 分解する場合、例えば [a,b,c ]=[1,2] c が分解されない場合、c は未定義になります

{
  let a,b,c,rest;
  [a,b,c=3]=[1,2];
  console.log(a,b);}
ログイン後にコピー

使用シナリオ1

①、変数交換

{
  let a=1;
  let b=2;
  [a,b]=[b,a];
  console.log(a,b);
}
ログイン後にコピー
②、抽出した関数の値を直接返します(代入を分割せずに、まず結果を取得してからインデックスを介して取得する必要があります)

{  function f(){return [1,2]
  }
  let a,b;
  [a,b]=f();
  console.log(a,b);
}
ログイン後にコピー
③の必要な値の一部のみを取り出します。返された結果

{  function f(){return [1,2,3,4,5]
  }
  let a,b,c;
  [a,,,b]=f();
  console.log(a,b); // 输出1 4
}
ログイン後にコピー
④. 配列の内容の長さは気にしない

{  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. オブジェクトの分割と代入

{
  let o={p:42,q:true};
  let {p,q}=o;
  console.log(p,q);
}
ログイン後にコピー

デフォルト値を設定するためのオブジェクトの分割と代入

{
  let {a=10,b=5}={a:3};
  console.log(a,b);//输出3 5
}
ログイン後にコピー
オブジェクトの構造化と代入によるローグ

以上がES6学習用の分解代入例を詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート