JS での分解

分解により、オブジェクトを「アンパック」し、そのプロパティを新しい変数に割り当てることができます。たとえば、オブジェクトの分解を見てみましょう。

Destructuring は、おいしい卵サンドイッチを作ろうとするものと見なすことができます。パン、ボローニャ、卵など、サンドイッチに必要な材料だけを冷蔵庫から取り出します。冷蔵庫にあるすべてのアイテムを取り出すわけではありませんよね? JSのDestruct要素と同じです。

Destructuringは、配列、オブジェクト、およびマップからデータを抽出し、それを個別の変数に格納できるようにする JavaScript 式です。分解により、配列から一度に多数の属性またはオブジェクトを抽出できます。

構文を見てみましょう。

const obj = {
  a: 2,
  b: 3,
}

// destructure assignment
const { a, b } = obj;

console.log(a); // 2
console.log(b); // 3

const { a,b } = obj;

破壊の種類:

既存の変数名への代入:

var student = {    // Object we will be destructuring
    firstname: 'Mohajit',
    lastname: 'Paul',
    dateofbirth: '2002'
};

// Destructuring:
const { firstname, lastname, dateofbirth } = student;
console.log( firstname, lastname, dateofbirth);

2. 新しい変数名への代入:

入力：

var student = {    // Object to destructure
    firstname: 'Mohajit',
    lastname: 'Paul',
    dateofbirth: '2002'
};

// Destructuring obj with different names:
const { firstname: F1N, lastname: L1N, dateofbirth: dob } = student;
console.log( F1N, L1N , dob);

3. デフォルト値での割り当て:

入力：

var student = {    // Object to destructure
    firstname: 'Mohajit',
    lastname: 'Paul',
    dateofbirth: '2002'
};
// Destructuring - variables without 
// assigning default values 
var { firstname, lastname, country } = student;
console.log("Without setting default values")
console.log( firstname, lastname, grade);

// Destructuring - variables by 
// assigning default values 
var { firstname = 'default firstname', 
      lastname = 'default lastname', 
      grade = 'default grade' } = student;
console.log("\n After setting default values")
console.log( firstname, lastname, grade);

このようにして、JS における破壊の話は終わりです。

私のソーシャルで私に従ってください：

ギットハブ

リンクイン

ツイッター