分割代入（配列やオブジェクトに使う）

  • 投稿日
  • 著者 NKMR
  • カテゴリー JavaScript

オブジェクトでの分割代入

const myProf = {
  name: 'hoge',
  age: 30
};
//↑を文字列で出力
const message = `私は${myProf.name}です。年齢は${myProf.age}歳です。`;
console.log(message);

messageにテンプレート文字列でオブジェクト（myProf）のプロパティを格納する場合、いちいち${myProf.name}のようにドットでmyProfにアクセスするのが面倒です。
これを分割代入で解消しましょう↓

const myProf = {
  name: 'hoge',
  age: 30
};
//↑のオブジェクトからあらかじめプロパティを取り出しておく↓
const {name, age} = myProf;
const message = `私は${name}です。年齢は${age}歳です。`;
console.log(message);

配列での分割代入

const myProf = ['hoge', 30];
const message = `私は${myProf[0]}です。年齢は${myProf[1]}歳です。`;
console.log(message);

配列での分割代入は、値を取り出す時に好きな変数名を割り当てることができます（配列は番号しか持っていないので）↓

const myProf = ['hoge', 30];
//↓好きな名前を割り当てる
const [name, age] = myProf;
const message = `私は${name}です。年齢は${age}歳です。`;
console.log(message);
基本