今回は関数というものをみていきます。表計算ではおなじみですが、プログラミングの世界ではどういうものなのでしょうか。

---

１　関数をつかってみる

　まずは使ってみましょう。

HTML（一部）

<script>
    function avg(x, y){
        let z = (x + y) / 2;
        return z;
    }
    let a = 10;
    let b = 20;
    let c = avg(a, b);
    document.write("<p>" + c + "</p>")
</script>

ブラウザ

　この例では、まず <script> 以下の１行目から４行目で関数を定義し、５行目から８行目で数値を設定し、関数を呼び出してその結果を出力しています。

HTML（一部）

    function avg(x, y){
        let z = (x + y) / 2;
        return z;
    }

　まず、１行目の function avg ( x , y ) の部分で、関数名 avg と使用する引数（ひきすう）x と y を指定しています。引数はその関数を処理するために必要な値を設定するものです。
　そして、どのような処理をするのかは２行目に記載してあり、それは引数 x と引数 y を足してその結果を２で割るという計算式です。さらに、その結果を新たな変数 z に代入します。
　３行目には return z とありますが、この z は戻り値（もどりち）といって、この関数の計算結果を出力します。
　書式は次のとおりです。

書式

function 関数の名前（引数）｛
    処理
    return 戻り値;
｝

　基本的には引数と戻り値とが必要ですが、これらを指定しない関数もあります。

HTML（一部）

    let a = 10;
    let b = 20;
    let c = avg(a, b);
    document.write("<p>" + c + "</p>")

　後半の部分では、変数 a b c を用意して変数 a と変数 b にはそれぞれ値を代入しています。
　そして、３行目で引数として a b を付して関数 avg を呼び出しています。
　これにより、定義された関数の引数 x には a の値が渡され、引数 y には b の値が渡されます。
　さらに関数の処理結果が戻り値の z に入りますが、その値が３行目にある変数 c に代入されることになります。
　最後に４行目において変数 c の出力を指示しています。

---

２　関数を使う意義

　なぜこのようなことをするのでしょうか。

HTML（一部）

<script>
    function avg(x, y){
        let z = (x + y) / 2.0;
        return z;
    }
    let a = 10;
    let b = 20;
    let c = avg(a, b);
    document.write("<p>" + c + "</p>")

    let d = 20;
    let e = 30;
    let f = avg(d, e);
    document.write("<p>" + f + "</p>")
</script>

ブラウザ

　avg ( 　 ) と記載し関数を呼び出すだけで、処理の内容を入力せずに済みます。
　この例では簡単な計算ですが、もっと複雑で長い計算であれば、関数を利用する効果は大きいでしょう。

---

３　戻り値がない関数

　また、戻り値がない関数をつくることもできます。

HTML（一部）

<script>
    function que(g){
        document.write("<p>");
        for(let i = 0; i < g; i++){
            document.write("？");
        }
        document.write("</p>");
        return;
    }
    que(10);
    que(20);
</script>

ブラウザ

　この関数 que は戻り値がありません。
　「？」という文字を引数 g の数だけ表示するというものです。
　なお、戻り値がない関数を定義するときには、return を省略することができます。

---

４　引数がない関数

　さらに、引数がない関数をつくることもできます。

HTML（一部）

<script>
    function hey(){
        document.write("<p>hey</p>");
    }
    hey()
</script>

ブラウザ

　この関数 hey は引数がありません。ちなみに戻り値もありませんね。
　前項で説明したとおり、この関数の定義では return が省略されています。

　ただし関数を呼び出すとき、関数名の後に（ ）は必要です。

---

５　次回

　さて次回も「関数」です。
　関数を使うときにはいろいろなルールがありますので、その点をみていきましょう。