## スプレッド構文と残りのパラメーター: 違いは何ですか? そしてどのように機能しますか?

ES2015 / ES6 のスプレッド構文と残りのパラメーターについて

ES2015 の導入により、2 つの新しい構文、スプレッド構文と残りのパラメーターが導入されました。 JavaScript での柔軟なデータ処理を容易にします。どちらも表面的には省略記号演算子に似ていますが、異なる目的を果たします。

Spread 構文

Spread 構文は 3 つのドット (...var) で示され、反復可能 (配列など) を個々の要素に分割します。これは主に 3 つのシナリオで使用されます:

• 配列の結合: 複数の配列を 1 つの配列に結合します:

  <code class="js">var abc = ['a', 'b', 'c'];
  var def = ['d', 'e', 'f'];
  var alpha = [ ...abc, ...def ];
  console.log(alpha); // alpha == ['a', 'b', 'c', 'd', 'e', 'f']</code>

• 関数に引数を渡す: 引数の配列を関数パラメータに展開します:

  <code class="js">function sum(...args) {
  return args.reduce((total, val) => total + val, 0);
  }
  const values = [1, 2, 3, 4];
  console.log(sum(...values)); // 10</code>

• 浅いオブジェクト コピーの作成: オブジェクトを展開します新しいオブジェクトへのキーの入力:

  <code class="js">const person1 = { name: 'John', age: 30 };
  const person2 = { ...person1, city: 'New York' };</code>

残りのパラメータ

スプレッド構文とは異なり、残りのパラメータは関数定義でのみ使用されます。これらは 3 つのドットと変数名 (...var) で示されます。残りのパラメータは、無限の数の引数を配列に収集します。

<code class="js">function logRest(...args) {
  console.log(args); // args == [ 'a', 'b', 'c', 'd', 'e' ]
}
logRest('a', 'b', 'c', 'd', 'e');</code>

主な違い

• 使用法: Spread 構文は配列を展開します。一方、残りのパラメータは引数を収集します。
• コンテキスト: スプレッド構文は式で使用され、残りのパラメータは関数定義で使用されます。
• 出力 : スプレッド構文は個々の要素を生成し、残りのパラメーターは配列を生成します。

結論

スプレッド構文と残りのパラメーターは JavaScript のデータ操作機能を強化し、便利な方法を提供します。新しい配列を作成し、引数を分散し、関数内の引数を収集します。それぞれの異なる用途を理解することで、開発者はこれらの構文を効果的に活用してコードの柔軟性と簡潔性を高めることができます。

以上が## スプレッド構文と残りのパラメーター: 違いは何ですか? そしてどのように機能しますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。