[解決済み] [Solved] setTimeoutコールバックに正しい "this "コンテキストを渡すか？

質問

にコンテキストを渡すにはどうすればよいですか？ setTimeout ? を呼び出したいのですが this.tip.destroy() もし this.options.destroyOnHide を1000ms後に表示します。どうすればいいのでしょうか？

if (this.options.destroyOnHide) {
     setTimeout(function() { this.tip.destroy() }, 1000);
} 

上記を試すと this はウィンドウを指します。

解決方法は？

EDITです。 要約すると、この質問がされた2010年当時、この問題を解決する最も一般的な方法は、コンテキストへの参照を保存して setTimeout 関数呼び出しが行われるため setTimeout で関数を実行します。 this はグローバルオブジェクトを指しています。

var that = this;
if (this.options.destroyOnHide) {
     setTimeout(function(){ that.tip.destroy() }, 1000);
} 

その1年前に発表されたばかりのES5仕様では bind メソッド というのも、まだ広くサポートされておらず、これを使うにはポリフィルが必要だったからです。

if (this.options.destroyOnHide) {
     setTimeout(function(){ this.tip.destroy() }.bind(this), 1000);
}

は bind 関数は、新しい関数を this の値があらかじめ入力されています。

現代の JS では、これはまさに arrow 関数で解決される問題です。 ES6 :

if (this.options.destroyOnHide) {
     setTimeout(() => { this.tip.destroy() }, 1000);
}

アロー関数には this の値そのものにアクセスすることになります。 this の値は、それを囲むレキシカルスコープの値です。

また、HTML5では 標準化されたタイマー に戻って、コールバック関数に引数を渡すことができるようになりました。

if (this.options.destroyOnHide) {
     setTimeout(function(that){ that.tip.destroy() }, 1000, this);
}

こちらもご覧ください。

• setTimeout - 'この'問題