スタートページ＞ Javascript＞ 関数への引数渡し

可変個引数

例１：引数の個数が異なるときの処理

３個の数値を加える関数「加算関数」を想定します。

　　　　function 加算関数(引数１, 引数２, 引数３) {
　　　　　　var 合計 = 引数１ + 引数２ + 引数３;
　　　　　　return 合計;
　　　　}

呼出し側の引数個数により、次の結果になります。

（注意）実関数がないことの確認方法

ケース３で、引数３がないときはデフォルト値を用いるという使いかたがあります。それには
　　　　if (引数３ == null) 引数３ = デフォルト値;
とします。
　alert(引数３);　とすると ubdefined と表示されますが、if (引数３ == "undefined") としたのでは正しく処理されません。if (引数３ == "") としてもダメです。

    function 加算関数(引数１, 引数２, 引数３) {
        var 合計 = 引数１ + 引数２ + 引数３;
        return 合計;
    }
    function 例１() {
        var 答;
        答 = 加算関数(10, 20, 30);      // 引数が３個
          alert("ケース１：答 = " + 答);
        答 = 加算関数(10, 20, 30, 40);  // 引数が４個
          alert("ケース２：答 = " + 答);
        答 = 加算関数(10, 20);          // 引数が２個
          alert("ケース３：答 = " + 答);
    }

ケース４は実行されない

　

例２：argumentsオブジェクトによる可変個引数の実現

組み込み関数のなかには、
　　　　Marh.max(30, 50, 10);
　　　　Marh.max(30, 50, 10, 20, 40);
のように、引数の個数が任意な関数があります。

次のプログラムの「最大関数() 」は、Marh.max() と同じ機能を実現したものです。
　［実行」ボタンをクリックすると、関数「例１」が起動し、
　　　　最大値 = 最大関数(30, 50, 10, 20, 40);
により、最大値である「５０」が表示されます。

    function 最大関数() {
        var 最大値 = Number.NEGATIVE_INFINITY;        //  行Ｃ
        var 引数要素数 = arguments.length;            //  行Ｂ
        for (var i = 0; i < 引数要素数; i++) {
            var 引数要素値 = arguments[i];            //  行Ａ
            if (引数要素値 > 最大値) 最大値 = 引数要素値;
        }
        return 最大値;
    }

    function 例２() {
        最大値 = 最大関数(30, 50, 10, 20, 40); 
        alert(最大値);
    }

50が表示される

これを実現しているのがargumentsオブジェクトです。
　「最大関数」には仮引数がない（０個）のですが、呼び出されると、呼出し側の関数「例１」で与えた実引数が、自動的に配列 arguments[i] に入り（行Ａ）、その要素数（実引数の個数）が arguments.length に入ります（行Ｂ）。
　この例では、
　　　　arguments[0] = 30, arguments[1] = 50, … , arguments[4] = 40
　　　　arguments.length = 5
となります。
　（なお、行Ｃの Number.NEGATIVE_INFINITY は、Javascriptで表現できる最小の値（負の無限大に相当）を与えるものです。最大値は Number.POSITIVE_INFINITY です。）

例３：複数の戻り値

関数から、呼出側に一つの変数 x を戻すには、
　　　関数側では return x;
　　　呼出側では、var a = 関数();
としますが、複数の戻し値がある場合は、次の二つの形式があります。変数は、スカラーでも配列でも構いません。

形式Ａ：順序で渡す
　　関数側
　　　return [ 変数０, 変数１, … ,　変数Ｎ ];
　　呼出側
　　　var 戻り値 = 関数();
　　　var 変数Ａ = 戻り値[0];
　　　var 変数Ｂ = 戻り値[1];
　　　　　：　　　// 必要なものだけ記述すればよい
　　　var 変数Ｎ = 戻り値[n];

形式Ｂ：名称で渡す（個数が多く順番を覚えるのが面倒なとき）
　　関数側
　　　return { 名称０:変数０, 名称０:変数１, … ,　名称０:変数Ｎ };
　　呼出側
　　　var 戻り値 = 関数();
　　　var 変数Ａ = 戻り値.名称０;
　　　var 変数Ｂ = 戻り値.名称１;
　　　　　：　　　// 必要なものだけ記述すればよい
　　　var 変数Ｎ = 戻り値.名称Ｎ;

例３Ａ

function 関数３Ａ() {
    var スカラー = "s";
    var 一次元配列 = [ "a", "b", "c" ];
    var 二次元配列 = [
             [ 0,  1,  2 ],
             [10, 11, 12 ]
        ];
    return [スカラー, 一次元配列, 二次元配列];  // [ ] で囲む
}

function 例３Ａ() {
    var 戻り値 = 関数３Ａ();
    var 変数Ｘ = 戻り値[0];
    var 変数Ｙ = 戻り値[1];
    var 変数Ｚ = 戻り値[2];
    var Ｙ件数 = 変数Ｙ.length;
    var Ｚ行数 = 変数Ｚ.length;
    var Ｚ列数 = 変数Ｚ[0].length;
    var 結果 = "変数Ｘ：" + 変数Ｘ + "<br>";
    結果 += "変数Ｙ" + "<br>";
    for (var i = 0; i < Ｙ件数; i++) {
        結果 += "　変数Ｙ[" + i + "]=" + 変数Ｙ[i];
    }
    結果 += "<br>";
    結果 += "変数Ｚ<br>";    
    for (i = 0; i < Ｚ行数; i++) {
        for (var j = 0; j < Ｚ列数; j++) {
            結果 += "　変数Ｚ[" + i + "][" + j + "]=" + 変数Ｚ[i][j];
        }
        結果 += "<br>";
    }
    document.getElementById("３Ａ表示場所").innerHTML = 結果;
}

例３Ｂ

function 関数３Ｂ() {
       :
       :  // 関数３Ａと同じ
       :
    return { "x":スカラー, "y":一次元配列, "z":二次元配列 };  // { } で囲む
}

function 例３Ｂ() {
    var 戻り値 = 関数３Ａ();
    var 変数Ｘ = 戻り値.x;
    var 変数Ｙ = 戻り値.y;
    var 変数Ｚ = 戻り値.z;
       :
       :  // 例３Ａと同じ
       :
}