「クラス」内のオブジェクト関数の「クラス」オブジェクトを参照

Question

image.onloadのクラスオブジェクトを参照する方法はありますか？ thisは画像そのものを指します。テクスチャオブジェクトをどのように参照できますか？

https://jsfiddle.net/yL648t40/

function Texture(url){ 
    this.image = new Image(); 
    this.image.src = url; 
    this.image.onload = function(){ 
    this.width = this.image.width; 
    this.height = this.image.height; 
    } 
} 

text = new Texture("http://opengameart.org/sites/default/files/styles/watermarked/public/bone2-equus_hemionus.png"); 

document.body.innerHTML += text.image + "<br>"; 
document.body.innerHTML += text.image.src + "<br>"; 
document.body.innerHTML += text.image.width + "<br>"; 

私はobiviouslyそれはあなたから自己引数を削除する必要が

Answer 1

動作しないテクスチャクラス

self = this; 
this.image.onload = function(self){ 
    self.width = self.image.width; 
    self.height = self.image.height; 
} 

しかし、内部でこのようなものを使用して試してみましたあなたのハンドラー：

self = this; 
this.image.onload = function(){ 
    self.width = self.image.width;  
    self.height = self.image.height; 
} 

もう1つのオプションは、この関数をバインドすることですが、純粋なjavascriptを使用すると複雑になります。

Answer 2

sevaralオプションがあります。

最初：this answerとして提案されている回避策を使用してください：

第2：このようにFunction.bindを使用してください。

function Texture(url){ 
    this.image = new Image(); 
    this.image.src = url; 

    var loadHandler = function(){ 
    this.width = this.image.width; 
    this.height = this.image.height; 
    }; 

    this.image.onload = loadHandler.bind(this); 
} 

サード：（ご使用の環境がES6を余裕があれば）自分の体にthisコンテキストを保持します使用ES6の矢印機能、。 Hereはいい記事です。