環境
MacBook Pro (2.3 GHz 8コアIntel Core i9)
macOS 14.0（23A344）
Homebrew 4.3.8
gh 2.52.0
まとめ
分割代入を行うことで下記のようなメリットが得られる
- JavaScriptの分割代入はプロパティを取り出せる
- 同じ変数名を使う場合、コードが簡潔になる
- 複数のプロパティを取り出すときは特に便利
目次
オブジェクト
分割代入_不使用
const myProfile = {
name: "Jochun",
age: "25"
};
const message1 = `名前は${myProfile.name}です、年齢は${myProfile.age}歳です。`;
console.log(message1);
// 出力結果
// 名前はJochunです、年齢は25歳です。
分割代入_使用
const myProfile = {
name: "Jochun",
age: "25"
};
const { name, age } = myProfile;
const message2 = `名前は${name}です、年齢は${age}歳です。`;
console.log(message2);
// 出力結果
// 名前はJochunです、年齢は25歳です。
配列
分割代入_不使用
const myProfile = ["Jochun", 25];
const message3 = `名前は${myProfile[0]}です、年齢は${myProfile[1]}歳です。`;
console.log(message3);
// 出力結果
// 名前はJochunです、年齢は25歳です。
分割代入_使用
const myProfile = ["Jochun", 25];
const [ name, age ] = myProfile;
const message4 = `名前は${name}です、年齢は${age}歳です。`;
console.log(message4);
// 出力結果
// 名前はJochunです、年齢は25歳です。
注意点：配列のプロパティははっきりしていないが、下記のnameやageのように変数を決める必要がある。