スプレッド構文

JavaScript では、スプレッド構文は、インデックス付きまたは反復可能なデータ型を反復可能なデータ型、具体的には配列またはオブジェクトに拡張する方法です。

残りの構文は同様の構造を使用して拡散するのに対し、残りのパラメータを使用すると関数に未知の量の引数を渡すことができます。スプレッド構文は、このプロセスを逆にして、個々のコレクションがその構成要素に分割されるようにします。

これは、オブジェクトまたは配列の要素を新しいオブジェクトまたは配列に転送する必要がある場合に特に便利です。さらに、関数の引数では、スプレッド演算子を使用して個々の要素を関数のパラメーターに渡すことができます。

たとえば、文字の配列があるとします。

const letters = ['c', 'a', 't']

そして、3 つの要素を受け取り、それらを使って何かを行う関数があるとします。

let spell = (x, y, z) => {
  return y + x + z;
}

文字配列から個々の要素を渡したい場合は、関数を呼び出すときにスプレッド演算子を使用できます。これにより、配列要素が引数リストに自動的に分散されます。

console.log(spell(...letters));
// => logs "act"

前述したように、配列 (または文字列) から反復可能な要素をコピーすることもできます。

const moreLetters = [...letters];
console.log(moreLetters);
// => logs ['c', 'a', 't']

これにより、配列をより簡単に組み合わせたり連結したりすることもできます。

const evenMoreLetters = [...letters, ...moreLetters];
console.log(evenMoreLetters);
// => logs ['c', 'a', 't', 'c', 'a', 't']

配列は、配列要素が値、インデックス番号がキーとなるオブジェクトに分散することもできます。

const objLetters = {...letters}
console.log(objLetters);
// => logs { 0: "c", 1: "a", 2: "t" }

スプレッド構文を使用してオブジェクトをマージすることもできます。

const objUno = {
  'one': 1
}

const objDeux = {
  'two': 2
}

const objDrei = {...objUno, ...objDeux};

console.log(objDrei);
// => logs { one: 1, two: 2 }

これは表面をなぞっただけですが、反復可能なデータ型のコピーや結合、関数への複数の引数の受け渡しなどのタスクを効率化するスプレッド演算子の構文能力を示しています。いつものように、書かなければならないコードが減れば減るほど、開発者としての作業は楽になります。

引用: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_syntax

以上がスプレッド構文の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。