JavaScriptのクロージャについて、おさらいします。
習うより慣れろということで、こんなコードを書きました。
makeFunc という関数があり、変数と関数を１つずつ定義しています。そして、その返却値は関数そのものです。
コンソールで出力すると、関数そのものが格納されていることが分かります。
そして24行目でmyFuncを実行すると、格納されたdisplayNameが実行されて、nameが返されます。つまり、chuckが表示されます。
でも、ちょっと引っかかるものがあります。
なぜなら、ローカル変数の生存期間は、その関数が実行されている間だけです。24行目の時点ではdisplayNameを呼んでいるのであって、関数makeFuncおよび変数nameはもう無関係のはず…？？
この疑問への答えがクロージャです。
myFuncはmakeFunc()という関数のみならず、その関数が作成された環境も保存しているのです。これを"myFuncがクロージャになった"という言い方をします。
よって、makeFunc内のnameには"chuck"が保持されています。なるほど…。
さらに、クロージャを使った面白い例があります。
関数ファクトリです。
makeAdderは関数を返すためだけの関数です。
つまり、40, 41行目のように、ある引数を渡してそれを反映した関数を返すのです。
40行目では５を渡しています。makeAdderのxにあたります。その結果、makeAdder内部の関数のreturn x + yのx に5 が保存されます。そして 5 + y を戻り値として持つ関数がadd5に格納されます。
41行目の処理もまったく同様で、この場合はx が10となります。
なので、43, 44行目で2を引数に渡して出力をすると、違った結果が表示されます。
ちなみに、引数として与えた2はyとして処理されます。
クロージャ、なんとなく分かった気になってましたが、なかなか面白いですね…。
ここまでが基本的な使い方で、次回は実践的な使い方について書いていきたいと思います。
書いたコード
