JavaScript | 分割代入

分割代入構文は、配列、オブジェクトから値を取り出して別個の変数に代入することを可能にするJavaScriptの式です。

分割代入 (Destructuring assignment) 構文は、配列から…

developer.mozilla.org

■オブジェクトから取り出す場合

message1はテンプレートリテラルを用いた記述です。
message2は分割代入構文になります。

consoleに出力した結果は同様です。

const myProfile = {
  name:"もり",
  age:28,
};

//テンプレートリテラル
const message1 = `名前は${myProfile.name}です。年齢は${myProfile.age}歳です。`;
console.log(message1);

//分割代入
const {name,age} = myProfile;
const message2 = `名前は${name}です。年齢は${age}歳です。`;
console.log(message2);

const myProfile = {

name:"もり",

age:28,

};

//テンプレートリテラル

const message1 = `名前は${myProfile.name}です。年齢は${myProfile.age}歳です。`;

console.log(message1);

//分割代入

const {name,age} = myProfile;

const message2 = `名前は${name}です。年齢は${age}歳です。`;

console.log(message2);

■配列から取り出す場合

message3はテンプレートリテラルを用いた記述です。
message4は分割代入構文になります。

consoleに出力した結果は同様です。

//配列
const myProfile = ['もり', 28];

//テンプレートリテラル
const message3 = `名前は${myProfile[0]}です。年齢は${myProfile[1]}歳です。`;

console.log(message3);
//分割代入
const[name,age] = myProfile;
const message4 = `名前は${name}です。年齢は${age}歳です。`;
console.log(message4);