ES6の代入分割機能の使い方

今回はES6の分割代入機能の使い方を紹介します。この記事では合計4つの方法を詳しく説明します。

変数の値を交換する

[x, y] = [y, x];

上記のコードは、変数 x と y の値を交換します。この記述方法は簡潔であるだけでなく、読みやすく、セマンティクスも非常に明確です。

関数から複数の値を返す

関数は 1 つの値のみを返すことができます。複数の値を返したい場合は、配列またはオブジェクトでのみ返すことができます。代入を分割すると、これらの値を取得するのが非常に便利になります。

// 返回一个数组
function example() {
 return [1, 2, 3];
}
var [a, b, c] = example();
// 返回一个对象
function example() {
 return {
  foo: 1,
  bar: 2
 };
}
var { foo, bar } = example();

関数パラメータの定義

構造化代入により、パラメータのセットを簡単に変数名に対応させることができます。

// 参数是一组有次序的值
function f([x, y, z]) { ... }
f([1, 2, 3]);
// 参数是一组无次序的值
function f({x, y, z}) { ... }
f({z: 3, y: 2, x: 1});

代入の構造化は、JSON オブジェクトからデータを抽出する場合に特に便利です。

var jsonData = {
 id: 42,
 status: "OK",
 data: [867, 5309]
};
let { id, status, data: number } = jsonData;
console.log(id, status, number);
// 42, "OK", [867, 5309]

上記のコードは、JSON データの値を素早く抽出できます。

jQuery.ajax = function (url, {
 async = true,
 beforeSend = function () {},
 cache = true,
 complete = function () {},
 crossDomain = false,
 global = true,
 // ... more config
}) {
 // ... do stuff
};

上記の紹介を読んだ後は、この方法を習得したと思います。さらに興味深い情報については、php 中国語 Web サイトの他の関連記事に注目してください。関連する読み取り：max-widthとmin-heightは、IE6によってサポートされていません。達成します

以上がES6の代入分割機能の使い方の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。