【JavaScript】引数 - 仮引数と実引数で関数に値を与える

JavaScriptの引数について解説します。

引数

引数は“関数に値を与える仕組み”です。

関数の呼び出し元から値を与えることができ、汎用性の高い処理を実現できます。

引数を使うには『関数の定義』に仮引数、『関数の呼び出し』に実引数を記述します。

仮引数

仮引数は“関数で値を受け取る変数”です。

仮引数変数とも呼び、基本的には通常の変数と同様に扱えますが、関数のブロック（波括弧{}）内のみで使用可能な変数になります。

基本構文

function 関数名( 仮引数１, 仮引数２ ... ) {
    // 処理...
}

仮引数は関数の定義で丸括弧（()）内に記述します。

１つの関数で複数の仮引数を扱うには、カンマ（,）で区切ります。

サンプル

___ih_hl_start
function addition( x, y ) {
___ih_hl_end
    const result = x + y;
    console.log( x + " + " + y + " = " + result);
}

１行目の( x, y )の部分が仮引数です。

２つの仮引数xとyを定義しています。

実引数

実引数は“関数に与える値”です。

基本構文

関数名( 実引数１, 実引数２ ... )

実引数は関数の呼び出しで丸括弧（()）内に記述します。

実引数は変数や値などで記述可能で、複数扱う場合はカンマ（,）で区切ります。

サンプル

function addition( x, y ) {
    const result = x + y;
    console.log( x + " + " + y + " = " + result);
}

___ih_hl_start
addition(3, 8);
___ih_hl_end

3 + 8 = 11

６行目の(3, 8)の部分が実引数です。

２つの実引数として数値の3と8を与えています。

実引数は先頭から順番に仮引数に記憶されるため、変数xに3、変数yに8が記憶されます。

また、関数の呼び出しごとに実引数を変更することも可能です。

function addition( x, y ) {
    const result = x + y;
    console.log( x + " + " + y + " = " + result);
}

addition(3, 8);
___ih_diff_start
+addition(11, 33);
+addition(1234, 5678);
___ih_diff_end

3 + 8 = 11
11 + 33 = 44
1234 + 5678 = 6912

同じ関数を呼び出していますが、実引数が異なるため、関数の処理結果が変わっています。

このように引数を使うことで、値に依存しない汎用性高い関数を作成できます。