Javascript OOP：オブジェクトを参照する方法

Question

私は以下のJavaScriptオブジェクトを持っています。ウィンドウのサイズが変更されたら、それ自身のresize()メソッドを呼び出すようにします。ただし、window.onresize関数では、thisはCanvasオブジェクトではなくwindowを指します。どのようにCanvasオブジェクトを呼び出すのですか？

function Canvas(element) { 
    this.element = element; 
    this.canvas = element.getContext("2d"); 
    this.width = element.width; 
    this.height = element.height; 

    this.resize = function() { 
     this.width = window.innerWidth; 
     this.height = window.innerHeight; 

     this.element.width = this.width; 
     this.element.height = this.height; 
    }; 

    window.onresize = function() { 
     this.resize(); 
      ^- error 
    }; 
} 

ありがとうございます。

Answer 1

window.onresize = this.resize.bind(this); 

あなたは古いブラウザをサポートしている場合は、Function.prototype.bind()ためthe MDN compatibility patchが含まれます。

Answer 2

onresizeハンドラのクロージャ内のコンストラクタのスコープに値 'this'を保存します。

var _this = this; 
window.onresize = function() { 
    _this.resize(); 
};