rest parameters とは、不特定多数の引数を配列として受け取る構文です。
構文
function(a, b, ...theArgs) { // ... }
説明
関数の最後の名前付き引数に "...
" の前置辞を付けると、この最後の引数は、実際に関数に渡された残りの引数による 0
からtheArgs.length
までの要素の配列になります。
上記の例で、最初の引数は a
に、2 番目の引数は b
にマッピングされるため、theArgs
は、関数に渡された引数の 3 番目から最後までを集めた配列になります。
rest parameters と arguments
オブジェクトの違い
rest parameters と arguments
オブジェクトの間には、主に 3 つの違いがあります:
- 残余引数は、各引数に個別の名前が与えられていないだけです。一方で、
arguments
オブジェクトは、関数に渡されるすべての引数を含みます; arguments
オブジェクトは実配列ではありません。一方 rest parameters は、Array
インスタンスです。これは、sort
、map
、forEach
、pop
のようなメソッドを直接適用できることを意味します。arguments
オブジェクトは、(callee
プロパティのように) 自身固有の追加機能の持っています。
引数から配列へ
rest parameters は、arguments により引き起こされた定型コードを減らすために導入されました。
// rest parameters の登場以前は、以下のように記述していました: function f(a, b){ var args = Array.prototype.slice.call(arguments, f.length); // … } // これは以下と等価です: function f(a, b, ...args) { }
例
theArgs
は配列なので、length
プロパティを使用して要素数を取得できます:
function fun1(...theArgs) { console.log(theArgs.length); } fun1(); // 0 fun1(5); // 1 fun1(5, 6, 7); // 3
次の例では、rest parameters を使用して 2 番目の引数から最後の引数までを集め、最初の引数とそれらを乗算します:
function multiply(multiplier, ...theArgs) { return theArgs.map(function (element) { return multiplier * element; }); } var arr = multiply(2, 1, 2, 3); console.log(arr); // [2, 4, 6]
次の例では、rest parameters に対して Array
メソッドが使用できることを示します。しかし、arguments
オブジェクトに対してはできません:
function sortRestArgs(...theArgs) { var sortedArgs = theArgs.sort(); return sortedArgs; } console.log(sortRestArgs(5,3,7,1)); // 1,3,5,7 を表示します function sortArguments() { var sortedArgs = arguments.sort(); return sortedArgs; // 前の行でエラーになるため、これは実行されません } // TypeError を投げます: arguments.sort は関数ではありません console.log(sortArguments(5,3,7,1));
arguments
オブジェクト上で Array
メソッドを使用するには、まずオブジェクトを実配列に変換する必要があります。
仕様
仕様 | 策定状況 | コメント |
---|---|---|
ECMAScript 2015 (6th Edition, ECMA-262) Function Definitions の定義 |
標準 | 初期定義。 |
ECMAScript 2017 Draft (ECMA-262) Function Definitions の定義 |
ドラフト |
ブラウザの実装状況
機能 | Chrome | Edge | Firefox (Gecko) | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|---|
基本サポート | 47 | (有) | 15.0 (15.0) | 未サポート | 34 | 未サポート |
機能 | Android | Android Webview | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile | Chrome for Android |
---|---|---|---|---|---|---|---|
基本サポート | 未サポート | 47 | 15.0 (15.0) | 未サポート | 未サポート | 未サポート | 47 |