プロフィール

ドミノ

Author:ドミノ
FC2ブログへようこそ!

最近の記事

最近のコメント

最近のトラックバック

月別アーカイブ

カテゴリー

ブロとも申請フォーム

この人とブロともになる

くーすーって美味しいよね
雑感をつらつらと書いています。 主にはIT技術のことをメインに書いていけたらとおもっとります。
スポンサーサイト
上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

クロージャとthisスコープ
AJAXって面白いよなーと思い、最近になってJavaScriptの勉強を始めたがとっても奥が深い。いろんなとこでつまづいてしまう。
そんな中で、
ひげぽん OSとか作っちゃうかMona-: 実践 prototype.js [2]
ひげぽん氏の「イベントハンドラ内で this を参照する」という記事を読んでいたのだが、すぐには理解できなかった。

自分の理解の過程を備忘録として残しておく。
なお、
指向性メモ::2005-07-24::クロージャとOOPとJavaScriptの謎仕様
も大変参考にさせていただきました。

(1)初心者が犯しやすいミスコード。


hoge : function {
// do something
},
some : function() {
var element = $('elementname');
element.onclick = function() {
this.hoge();
}
}


普通に考えると上記のコードになりがちだと思う。
このコードがなぜいけないかというと、イベントに渡された関数オブジェクトに含まれるthisが参照するのは、インスタンスのメソッドではないからだ。何をさしているかというとこの場合、thisはelementノードをさしている。

(2)次にひげぽん氏が書かれている、self作戦コード


hoge : function {
// do something
},
some : function() {
var element = $('elementname');
var self = this;
element.onclick = function() {
self.hoge(); // thisを参照
}
}


このコードでイベントハンドラ内でthisを参照することができるようになるのだが始め、self.hoge()のselfはなぜ参照可能なのか?不思議に思った。selfのスコープが外れているはずだからである。
まあここにはクロージャの特性が大きく関わっていることが解った。
*この辺りがJavaScriptの面白いところであり、難しいところなんだろうなと思う。
Dynamic Scripting
クロージャについて丁寧に書かれており大変参考になりました。


クロージャを使ったthisスコープの制御ができるようになれば、イベントに渡す関数オブジェクトや、setTimeout関数に渡す関数オブジェクトの実装がすんなりいくだろう。





スポンサーサイト

テーマ:プログラミング - ジャンル:コンピュータ

この記事に対するコメント

この記事に対するコメントの投稿














管理者にだけ表示を許可する


この記事に対するトラックバック
トラックバックURL
→http://dominodomino.blog33.fc2.com/tb.php/5-0c41af74
この記事にトラックバックする(FC2ブログユーザー)
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。