今回は無名関数についてです。オブジェクトのメソッドとおおいに関係があります。

---

１　無名関数

関数の書式

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

無名関数の書式

const 変数の名前 = function（引数）｛
    関数の処理
｝

　上では関数を定義して処理を記述しているのに対し、下では変数に関数を代入しているのがわかります。

　実際の例を見ていきましょう。

HTML（一部）

<script>
    let a = 5;
    let b = 4;

    const f = function(x, y){
        return x + y;
    }

    let c = f(a, b);
    document.write("<p>" + c + "</p>");
</script>

ブラウザ

　<script> 以下の１行目及び２行目で、変数 a 変数 b にそれぞれ数値を代入しています。
　次に３行目から５行目において無名関数を定義しています。つまり、引数 x と引数 y とを足すという関数が変数 f に代入されるというものです。

　そして６行目では変数 f の引数として変数 a と変数 b とが指定されることにより、無名関数が呼び出され、結果的に変数 c には計算結果が代入されることになります。

　最後に７行目で変数 c の値を出力しています。

　さて、この関数の定義を変更してみましょう。

HTML（一部）

<script>
    let a = 5;
    let b = 4;

    const f = function(x, y){
        return x * y;
    }

    let c = f(a, b);
    document.write("<p>" + c + "</p>");
</script>

ブラウザ

　足し算を掛け算に変更してみました。

---

２　コールバック関数

　無名関数はどういった場面で使われるのでしょうか。
　その前にコールバック関数というものを紹介します。

HTML（一部）

<script>
    function f1(a) {
        a();
        document.write("<p>f1に記述</p>");
    }

    function f2() {
        document.write("<p>f2に記述</p>");
    }

    f1(f2);
</script>

ブラウザ

　ここでは f2( ) がコールバック関数となります。
　<script> 以下の８行目をみると、f1 の引数として f2 が指定されています。
　１行目には f1 が定義されており、変数 a を引数として f1 が実行されることになります。
　すると、変数 a の中身は関数 f2 ですので、f2 に定義された「f2 に記述」が出力されることになるのです。
　その後、f1 に直接記載のある「f1 に記述」が出力されます。

　このようにコールバック関数とは、ほかの関数の引数として利用できるものなのです。

---

３　無名関数を利用する

　またコールバック関数はメソッドの引数としても利用ができます。
　多くの書籍で紹介されているのは forEach メソッドです。
　このメソッドは、配列の要素を順にコールバック関数の引数として渡すものであり、その前提としてコールバック関数を引数として受け取るというものです。

書式

配列.forEach（コールバック関数の処理）

HTML（一部）

<ul>
<script>
    let w = ["コール","バック","関数"]
    w.forEach(function(a){
        document.write("<li>" + a + "</li>");
    });
</script>
</ul>

ブラウザ

　まず、配列 w からひとつずつ要素が取り出され、引数 a に「コール」が代入され、処理が実行されます。
　それが配列の要素の数だけ繰り返されることになります。

---

４　次回

　さて次回はとても重要な考え方である「オブジェクト」を見ていきます。