JavaScriptのDestructuring Assignment(分割代入)の使用方法


  1. 配列の分割代入:

配列の要素を個別の変数に代入することができます。以下はその例です。

const array = [1, 2, 3, 4, 5];
const [a, b, c, d, e] = array;
console.log(a); // 1
console.log(b); // 2
console.log(c); // 3
console.log(d); // 4
console.log(e); // 5
  1. オブジェクトの分割代入:

オブジェクトのプロパティを変数に代入することもできます。以下はその例です。

const obj = { name: 'John', age: 30, city: 'Tokyo' };
const { name, age, city } = obj;
console.log(name); // 'John'
console.log(age); // 30
console.log(city); // 'Tokyo'
  1. 配列の一部を分割代入:

配列の一部の要素だけを取り出して代入することもできます。

const array = [1, 2, 3, 4, 5];
const [a, b, ...rest] = array;
console.log(a); // 1
console.log(b); // 2
console.log(rest); // [3, 4, 5]
  1. デフォルト値の設定:

分割代入の際に、値がundefinedの場合にデフォルト値を設定できます。

const obj = { name: 'Jane', age: undefined };
const { name, age = 25 } = obj;
console.log(name); // 'Jane'
console.log(age); // 25

Destructuring Assignmentは、コードを短く、可読性の高いものにするための素晴らしい手法です。さまざまな場面で活用できますので、ぜひ使ってみてください。