〜クロージャってなんだよ、キャラ名か〜 「良いJavaScript」と「悪いJavaScript」の追求

1. わかる LT@２
〜～クロージャってなんだよ。キャラ名か〜～
「良良いJavaScript」と「悪いJavaScript」の追求
2012/11/3 れこ

2. お題：JavaScript
オライリー・ジャパン著
JavaScript
The Good Parts
を買いました。
⾊色々と考えさせられることが
ある
よし、まとめていこう！！
※ほぼここからの引⽤用です

3. 1,スコープのおさらい
 スコープとは
 変数などの⽣生存期間
 値へのアクセス制御
 何のためにあるの？
 名前の衝突を減らす
 メモリ管理理の⾃自動化
etc..

4. JavaScriptにおけるスコープ
 グローバルスコープ
 関数スコープ ≠ ブロックスコープ
 ⼀一般的なお作法
 変数の定義はできるだけ遅く、その変数を使う直前で⾏行行う
 それは、ブロックスコープありでのお話。
 jsでは、使う変数は関数の最初に列列挙すべき

5. オブジェクトのおさらい
 jsでは、全てがオブジェクト
 専修のれん君のLTでもちょろっと話が出た
 オブジェクトにはあらゆる型、値が⼊入れられる
 関数オブジェクトも⼊入る
var foo = {
foo: “bar”,
say: function() {
return “hello”;
}
}

6. 2,クロージャ
 聞いたことはあるが、いまいち分からん
 関数が作成された歳のコンテキストへのアクセスが可能になって
いる
 クロージャ（クロージャー、closure、閉包）はプログラミ
ング⾔言語における関数オブジェクトの⼀一種。引数以外の変
数を実⾏行行時の環境ではなく、⾃自⾝身が定義された環境（静的
スコープ）において解決することを特徴とする。関数とそれ
を評価する環境のペアであるともいえる。この概念念は少なく
とも1960年年代のSECDマシンまで遡ることができる。
http://ja.wikipedia.org/wiki/クロージャ

7. ( ´◔‿ゝ◔`)！？

8. 噛み砕く。
 出⼒力力結果はいくつ？

9. 補⾜足説明
 関数なのに呼び出しがない！
 plus()…とかはならない。
 functionの戻り値に注⽬目
 オブジェクトが返ってる
 関数を実⾏行行していないのに！
 ()があることに注⽬目
 これで関数を呼び出す

10. ここまでの感想
 returnでオブジェクトを返すソースは沢⼭山⾒見見てたけど、実際ど
う動くのかを考えるとかなり⾯面⽩白い
 名前の衝突は、普通は起こり得ない（⼤大体の⼈人が避けてるか
ら）けど、
 それは礼儀でなく、⾔言語機能の理理解をより深める楽しみにな
りえそう

11. 実⽤用例例
 ページを徐々に⾚赤くする（jQuery不不使⽤用）
 http:/leko.jp/sys/test2.html
 ソースはソースから。
 同様に移動や表⽰示⾮非表⽰示のアニメーションもけっこう簡単に
書ける

12. まとめ
 jQueryを使わない、より綺麗麗なプログラム、楽しそう
 久々に他のライブラリへの浮気欲が⾼高まってる
 ⾃自前のprototype拡張ライブラリとか作ろうかな
 underscore.js使え
 来週の予定（未定）
 preventDefault()とstopPropagation()
 イベントの伝播と茶茶道的なJavaScript