JavaScriptを習得したい

on Note

引数とは何かを詳しく説明

引数とは、関数を呼び出す際、変換させたい値を入れる入力値用の変数です。関数では、{ }の中で何かしらの値やデータの変換が行われます。ではどの値を変換するのか、その変換対象の値を入れる変数にあたるのが引数です。

尚、引数はその関数の内部でのみ参照することができる変数です。

引数があるとなぜ便利か

関数とは、決められたルールに従って値やデータを受け取り、それを別の値やデータに変換して変換結果を返すものです。何か値を渡せば、中の命令通りに変換を行いその結果を返してくれます。

スクリプトの中で同じ関数を使い回すことはあります。つまり、同じ変換を何度も行うといったことはよくあるのです。

いくら変換の内容が同じであっても、入力する値(つまり変換させたい値)までもがいつも同じとは限りません。むしろ、変換させる値が変わりながらも変換内容は使い回す。これが、変換命令を関数として定義することの便利なところでもあります。

入力値を変数で受け取るようにしておけば、関数の書き換えなしに、異なる値の変換が可能となります。

関数と引数の関係

関数の具体例と引数

例として下記のような、三角形の面積を計算する処理を関数で定義します。

三角形の面積の計算には底辺と高さ、2つの値が必要になります。この2つの値を渡せば、それに対する三角形の面積に変換して返してくれる、そういった関数が今回の例です。

function triangle(base, height) {
    return base * height / 2;
}

triangle(5, 6);

triangleという名前で関数を作成し、仮引数にbase、heightを用意しています。関数ブロック、つまり { } の中では「底辺×高さ÷2」という変換結果を返す命令となっています。

関数を呼び出すには triangle( ) を記述します。今回この計算に渡したい値は底辺5、高さ6なので triangle(5, 6) とします。

これで、底辺の値に5、高さの値に6を指定した場合の変換結果が返ってきます。

仮引数と実引数

上の具体例では、関数を呼び出す際、変換してほしい値をそのまま引数に渡しました。下記の例では、渡す値を一度変数に代入し、その変数名で関数に値を渡しています。

function triangle(base, height) {
    return base * height / 2;
}

const x = 5;
const y = 6;

triangle(x, y);

入力値が入る変数が引数ですが、これを仮引数とも呼びます。これに対し、今回の例のような、渡す値を代入した変数(今回の例ではxとy)を実引数と呼びます。

関数が受け取る値が入る変数が仮引数で、関数の呼び出し時に渡す値を入れた変数が実引数です。

戻り値とは何かを詳しく説明

関数の処理が何らかの計算だったりとかだと、関数の呼び出し側で処理の結果を返してもらう必要があります。その戻ってくる値に対して戻り値返り値とも呼ぶ)と呼んでいます。

関数からすれば、処理の結果を最終的に関数の呼び出し元に返す為の値、それが戻り値です。

return 戻り値;
で結果を返します。

function calc (x, y) {
    answer = x * y;     //計算結果「15」を変数「answer」に代入。
    return answer;      //変数「answer」を戻り値として返す。
}

calc(3, 5);     //複数の値を引数に渡す。結果の「15」が返ってくる。

上記の関数calc は2数の掛け算を行う関数です。関数の呼び出し側から受け取る値が入る引数に x と yを用意しています。

引数で受け取った値を変換した結果(計算結果)を変数answer に代入して、変換結果が入った変数answer を、関数の呼び出し元に return命令で返しています。

この変換(関数calcの処理)が必要になる場所で、calc( ) を記述して関数を呼び出します。その際に入力したい値を丸括弧の中に記述して calc(3, 5) とします。引数に3と5を渡すことになり、変換された結果の15が返ってきます。

 return命令を処理の末尾に記述するので、処理を全て終えてから最終的な値を返すことになります。処理文が複数あるとして、一連の処理の途中に return命令を記述すると、その時点で処理を終えて以降の処理が行われなくなります。

if文やswitch文などの条件分岐命令では、returnを途中で記述することもあります。