分割代入の使い方

分割代入とは

分割代入とは、配列やオブジェクトの一部を取り出して、他の変数に代入することができる式です。

とても便利なのですが、Internet Explorerは対応していません。

簡単な分割代入の利用例

以下は、簡単な分割代入の利用例です。

let [x,y,z] = [1,2,3];

上記でxが1、yが2、zが3になります。x、y、zは、配列ではありません。これは、let x = 1、let y = 2、let z = 3をそれぞれ実行したのと同じです。

以下のようにも使えます。

let x = [1,2,3];
let [y] = x;

上記は、yが1になります。let [y] = xの代わりにlet [y,z] = xとした場合、yが1でzが2になります。つまり、配列の最初の要素から順番に取り出して、変数に代入できます。

これは、let y = x[0]、let z = x[1]とそれぞれ代入しても同じ結果になりますが、一度に代入できる点がメリットです。

また、参照渡しではないため、y = 4を実行してもx[0]の値は1のままです。

残りを全部代入

配列の要素数がわからない時、残りすべての要素を代入させることもできます。

let x = [1,2,3,4,5,6,7,8,9];
let [y,...z] = x;

yは1になりますが、zは残りすべてが代入されて[2,3,4,5,6,7,8,9]の配列になります。

変数を入れ替える

分割代入を利用して、変数を入れ替えることもできます。

let x = 1;
let y = 2;
[x,y] = [y,x];

上記で、xが2、yが1になります。

関数の戻り値を分割代入する

関数の戻り値を、分割代入することもできます。

function func1() {
  return [1,2];
}

let [x,y] = func1();

func1を実行した時の戻り値は、配列の[1,2]です。このため、xが1、yが2になります。

オブジェクトでの利用例

オブジェクトでの利用も同じです。

const yamada = {
  address: "Tokyo",
  birthday: 2001
};
let {address} = yamada;

上記で、変数addressは「Tokyo」になります。

上記の場合、プロパティ名と変数名は一致させる必要があります。以下のようにすると、プロパティ名と異なる変数名に代入させることができます。

const yamada = {
  address: "Tokyo",
  birthday: 2001
};
let {address: x, birthday: y} = yamada;

上記で、変数xは「Tokyo」、変数yは2001になります。

配列と同じで、残りをすべてという代入もできます。

const yamada = {
  address: "Tokyo",
  birthday: 2001
};
let {...x} = yamada;

上記で、xはyamadaオブジェクトと同じになります。これは、シャローコピーとなるため、xのプロパティで値を変えてもyamadaの値は変わりません。