JavaScriptの関数に任意の数の引数を渡す方法【argumentsオブジェクトの使い方】

JavaScriptでは、関数を呼び出すときに渡せる引数の数に制限がありません。そのため、宣言された仮引数の数と実際に渡す引数の数が一致していなくても、エラーにならずに動作します。この仕様が、Javaのような言語で見られる伝統的なオーバーロード(多重定義)がJavaScriptではサポートされていない理由でもあります。

argumentsオブジェクトとは

argumentsは、アロー関数以外のすべての関数内で利用できるローカル変数(オブジェクト)です。関数の中でargumentsオブジェクトを参照することで、その関数に渡された引数へアクセスできます。argumentsには、関数が呼び出されたときに渡された各引数が格納されており、最初の引数のインデックスは0から始まります。

たとえば、関数に3つの引数が渡された場合、次のようにそれぞれの値へアクセスできます。

arguments[0] // 1番目の引数
arguments[1] // 2番目の引数
arguments[2] // 3番目の引数

argumentsは「配列風オブジェクト」である点に注意

argumentsは、関数に渡された引数の値を保持する配列風(Array-like)オブジェクトです。「配列風」とは、lengthプロパティや0から始まるインデックス付きのプロパティを持つ一方で、forEach()やmap()といったArrayの組み込みメソッドを持たないという意味です。これらの配列メソッドを使用したい場合は、Array.from(arguments) やスプレッド構文 [...arguments] を使って本物の配列へ変換しましょう。

サンプルコード

任意の個数の引数を受け取れる関数は、次のように作成できます。

function printAllArguments(a, b) {
    console.log("First arg: " + a)
    console.log("Second arg: " + b)
    console.log("All args: " + arguments)
}
printAllArguments(1)
printAllArguments(1, "hello")
printAllArguments(1, "hello", 1, "hello")

実行結果

First arg: 1 
Second arg: undefined 
All args: {"0":1}
First arg: 1
Second arg: hello 
All args: {"0":1,"1":"hello"} 
First arg: 1
Second arg: hello 
All args: {"0":1,"1":"hello","2":1,"3":"hello"} 

このように、仮引数として宣言していない引数もargumentsオブジェクト経由で受け取れるため、柔軟な関数設計が可能です。渡されなかった仮引数はundefinedになることにも注目してください。

モダンな代替手段：レストパラメータ

近年のJavaScriptでは、可変長引数を扱う目的でレストパラメータ(...args)構文を使うことも一般的です。レストパラメータは引数を本物の配列として受け取れるため、map()やfilter()などの配列メソッドをそのまま利用でき、argumentsよりも直感的で安全なコードが書けます。新規のコードでは、レストパラメータの使用を検討するとよいでしょう。