コールバックと無名関数

投稿日時：
カテゴリ：VBA・Javascript・PHP・その他プログラミング全般

色々あるプログラミング言語の中でもJavaScriptの基本文法は特殊な部類に入ります。
当校の講義では、他言語経験者も含め初心者が理解しにくいものとして「コールバック」「無名関数」が挙げられます。

実は、それほど難しいものではないのですが、見慣れるまでは不思議に感じるのかもしれませんね。

下記のソースコードを見てみましょう。
jQueryを使用したイベント設定の事例になるが、ID「button」をクリックしたら、関数「eventFunction」が発動して、alertが出力されるソースコードになっています。

$(“#button”).click(eventFunction);
function eventFunction(){ alert(“イベント発動”); }

コールバックとは、関数名を引数等に設定する事を指します。JavaScriptではイベントの設定で多用されます。
上記の事例もそうだが、「○○が××されたら指定した関数を発動しなさい」と設定することになります。

無名関数はその延長に過ぎません。

$(“#button”).click(eventFunction);
function eventFunction(){ alert(“イベント発動”); }

このソースコードを無名関数で記述する場合は、clickメソッドの引数に関数名を指定するのではなく、直接functionを記述すれば良いです。

$(“#button”).click(function(){ alert(“イベント発動”); });

この際のfunctionには関数名を記述する必要はありません。そのために「無名関数」と呼ばれるのですね。

function内の処理が複雑になると、{}やらインデントやらでソースコードが見づらいと感じる事もあると思いますが、落ち着いてソースコードを解読してみましょう。それほど難しくはないと思います。

使い分けとしては、イベントと関数が1:1なら無名関数、多:1ならコールバックを使用する傾向にあります。

JavaScriptやjQueryの書籍、Webサイト等ではサンプルのソースコードに無名関数を使用する事が多いです。
従って、これが分からないとサンプルを読む事もできないのできちんと修めておくことをお薦めします。

（担当：奥田　英太郎）