JSにおける分散演算子,静止演算子および破壊

皆さん、こんにちは.
これは私の最初のブログです.そして、このブログでは、JavaScriptのスプレッド演算子、休息演算子、および破壊について話しています.最近プロジェクトに取り組んでいる間、私は破壊の概念が全く異なるとわかりました、そして、ここでそれを共有することを考えました.では、始めましょう.

拡がり演算子
スプレッド演算子は、配列要素またはオブジェクトのプロパティを分割するために使用されます.配列要素またはオブジェクトの深いクローニングを行いますので、元の値には影響しません.
まず配列の例を見てみましょう.

const arr1 = [1, 2, 3]
const arr2 = [...arr1, 4, 5]
console.log(arr1);              // [1, 2, 3]
console.log(arr2);              // [1, 2, 3, 4, 5]
arr1.push(6, 7);
console.log(arr1);              // [1, 2, 3, 6, 7]
console.log(arr2);              // [1, 2, 3, 4, 5]

arr 1により多くの値を追加した後、arr 2は変更されません.
しかし、私が提供しなかったならばARR 2における演算子下記を見つけましょう

const arr1 = [1, 2, 3]
const arr2 = [arr1, 4, 5]
console.log(arr1);              // [1, 2, 3]
console.log(arr2);              // [[1, 2, 3], 4, 5]

はい.ネストした配列を作成します.
同様にオブジェクトも同様です.

const obj1 = {
  name: "Prince",
  Sex: "Male"
}
console.log(obj1);        //{name: "Prince", sex: "male"}

const obj2 = {
  ...obj1,
age: 25              //{age: 25, name: "Prince", sex: "male}
}
console.log(obj2);

obj1["height"] = "5'8 ft";
console.log(obj1);//{height: "5'8 ft",name: "Prince", sex: "male"}
console.log(obj2);   //{age: 25, name: "Prince", sex: "male}

休息演算子
REST演算子は、複数の引数が期待されるたびに関数で使用されます.

const filter = (...args) => {
  return args.filter(val => val%5===0)
}

console.log(filter(5, 10, 2, 4, 20));    // [5, 10, 20]

フィルタ関数を呼び出している間に5つの引数を渡しており、条件に応じて値を出力しているので、N個の引数を渡すことができます.

破壊する
また、次世代のJavaScript機能です.破壊は簡単に配列要素またはオブジェクトのプロパティを抽出し、変数に格納します.
上記の定義によって、あなたはそれが正確に広げられたオペレーターとして働くと思っていたでしょう、しかし、それは異なる働きです.
以下を見つけましょう.

// Array
const num = [11, 22, 33];
[x, y] = num;
console.log(x);                             // 11
console.log(y);                              // 22
[x, , y] = num;
console.log(x);                             // 11
console.log(y);                             // 33

配列を破壊するとき、それは左のキーインデックスに従ってインデックスの値を返します.そして、はい、左側に[ x , y ]のように書くとき、我々はどんな配列も作成していません.私は知っています、変なようです、しかし、私さえ以前混乱しました.

// Object
{name} = {
    name: "Audi",
    model: "A8",
    price: "1.5 cr"
}

console.log(name);                          // "Audi"
console.log(age);                           // undefined
// Above output will be undefined as age is not destructured and aligned with the same key

あなたは、それが破壊されていないので、同じキーで整列していないので、年齢が未定義で戻ることを上で見ることができます.
それはこの記事の人々のためです.🙏読書ありがとう!