Home > Javascript > Javascriptのthisに戸惑った

Javascriptのthisに戸惑った

普段適当な処理しか書いたことの無いJavascriptをマジメに書いていて、「this」に戸惑った。

オブジェクトの中でthis使ったら、Pythonのselfみたいに自分のオブジェクトを指すもんだとばかり思ってたよ。
違う場合があるんですね。

イベントやタイマー(setIntervalとかsetTimeoutとか)などで呼び出されると、thisは自分のオブジェクトを指すわけではない。
自分のオブジェクトを使いたいときは事前にthisをローカル変数に保存して利用する。

今回はイベントハンドラじゃなくってタイマーで呼び出して失敗した。
自分メモで動くソースを。

JavaScript:
  1. var obj = function () {};
  2. obj.prototype = {
  3.     timer: null,
  4.     hoge: 'hoge',
  5.     run: function() {
  6.         var self = this; // thisを保存しておく
  7.         var func_ref = function () {
  8.             alert(self.hoge); // イベントやタイマーで呼ばれるときは、selfを使う
  9.         }
  10.         this.timer = setTimeout(func_ref, 1000);
  11.     }
  12. }
  13. x = new obj();
  14. x.run();

参考
ひげぽん OSとか作っちゃうかMona- - 実践 prototype.js [2]
404 Blog Not Found:怠翻 - JavaScriptでありがちな9つのシマッタ

Comments:0

Comment Form
Remember personal info

Trackbacks:0

Trackback URL for this entry
http://blog.joyfullife.jp/archives/2007/09/11185000.php/trackback
Listed below are links to weblogs that reference
Javascriptのthisに戸惑った from 30からのBlog

Home > Javascript > Javascriptのthisに戸惑った

Search
Feeds
Meta

Return to page top