ECMAScript6関数の残りのパラメータ(Rest Parameters)_JavaScriptスキル

JS 関数内に引数オブジェクトがあり、実際のパラメータをすべて取得できることがわかります。 ES6 は、開始パラメータを除いたパラメータ、つまり残りのパラメータ (意味のない O(∩_∩)O~) を取得できる新しいオブジェクトをもたらしました。

この新しいオブジェクトは引数とは異なり、プログラマによってカスタマイズされた共通の識別子です:...

の前に 3 つのドットを付ける必要があります。

function func(a, ...rest) {
 console.log(a)
 console.log(rest)
}
func(1)
func(1, 2, 3, 4)

func の 2 番目のパラメーターの残りの部分に注目してください。先頭に 3 つのドットがあります。定義後2回呼び出した結果は以下の通りです

最初の呼び出しでは、rest は空の配列であり、2 回目は [2, 3, 4] であることがわかります。

別の例では、前に 2 つのパラメータを定義します

function func(a, b, ...rest) {
 console.log(a, b)
 console.log(rest)
}
func(1, 2)
func(1, 2, 3, 4)

出力結果は以下の通りです

上記の 2 つの例を通じて、残りのパラメーターの意味を理解できたはずです。

パラメータが残っているため、後で他のパラメータに従わないでください。そうしないと、エラーが報告されます

function func(a, ...rest, b) {
 
}

パラメータ b が休息の後に追加され、Firefox はエラーを報告します

残りのパラメーターを使用すると、関数の長さ属性がいくつか変更されます

function func(a, b, ...rest) {
}
func.length // 2

つまり、長さは休符を含まず、2になります。

生徒の中には、残りのパラメーターの前にパラメーターがないということはあり得るのかと疑問に思う人もいるかもしれません。 答えは「はい」です

function func(...rest) {
 console.log(rest)
}
func(1) // [1]
func(1, 2, 3, 4) // [1,2,3,4]

ここにある残りの部分は、実際には引数と同様の機能を持っています。これが引数の代わりになると考えている学生もいます。 ECMAScript にはこの意図があります。Rest Parameters はすでに放棄された ES4 に含まれていました (AS3 に詳しい学生はこれを知っているはずです)。Rest Parameters は ES6 にも残されました。

rest を引数と一緒に使用することはできず、エラーが報告されることに注意してください

function func(...rest) {
 console.log(rest)
 console.log(arguments)
}

Firefox コンソールは次のとおりです

引数と残りのパラメータの違い

引数は疑似配列 (配列のようなもの)
残りのパラメーターは実数配列 (Array) であり、すべてのメソッドは Array.prototype
にあります。 引数には callee があり、callee には caller
があります。

など

function func(a, ...rest) {
  console.log(rest instanceof Array)
}
func(1, 2) // true

最後に、残りのパラメーターを実際に適用して終了します

/*
 * 任意个数相加
 *
 * **示例**
 * sum(1)
 * sum(1, 2)
 * sum(1, 2, 3)
 */
function sum(first, ...rest) {
  var result = first
  var i = 0
  var len = rest.length
  while (i < len) {
    result += rest[i]
    i++
  }
  return result
}

以上がこの記事の全内容です。皆さんに気に入っていただければ幸いです。