分割代入とは？
分割代入とは、「配列の要素」や「オブジェクトのプロパティ」を分解・分割して、変数（や定数）に値を代入することです。
分割代入の具体例
オブジェクトの分割代入
下記のようなオブジェクトがあり、その中の要素を取り出して文章を出力したかったとしましょう。
const profile = {
name: "山田,
age: 20,
};分割代入を使わずに出力すると以下のようになります。
const message = `私の名前は${profile.name}です。年齢は${profile.age}です。`
console.log(message);出力結果
私の名前は山田です。年齢は20です。無事出力できました！
しかしこの出力方法だと、テンプレートリテラルの部分が少し冗長であり、他にも出力したい物が増えた時にコードが長くなって見にくいコードになってしまいます。そんな時に活躍してくれるのが分割代入です。
冒頭でも説明したように分割代入とは、「配列の要素」や「オブジェクトのプロパティ」を分解・分割して、変数（や定数）に値を代入することです。
なので今回の例の場合、
constで取り出したいオブジェクトのキーを { } の中に設定して、＝ で何から取り出したいか（今回はprofile変数）、をつなぎます。
const {name, age} = profileこの設定することで、先ほどのコードが
const profile = {
name: "山田,
age: 20,
};
//分割代入を使った方法
const {name, age} = profile
const message2 = `私の名前は${name}です。年齢は${age}です。`だいぶスッキリしますね。
分割代入を使うことでオブジェクトから指定のプロパティを抜き出して自由に使うことができるのでコード自体が簡潔になったり、見やすくなったりします。
配列の分割代入
次に配列に対しての分割代入を見ていきます。
const profile = ['山田', 20];
//分割代入を使わずに出力する方法
const message3 = `私の名前は${profile[0]}です。年齢は${profile[1]}歳です。`
console.log(message3);出力結果
私の名前は山田です。年齢は20です。今回は配列なのでインデックス番号を指定することで出力されます。
配列で分割代入を使う場合、オブジェクトと異なる点は配列なので配列として受け取ります。
配列はオブジェクトのように名前が決まってないので、順番で受け取ることになります。
つまり、nameに配列のprofileで最初に設定した’山田’の部分が入り、ageに次にprofileで設定した20が入るという形になります。
const profile = ['山田', 20];
//分割代入を使った方法
const [name, age] = profile;
const message4 = `私の名前は${name}です。年齢は${age}歳です。`配列の分割代入の場合は順番が大切になってきます。
オブジェクト同様にある配列から順番に要素抜き出して変数に設定することができます。
