疑難解答原型類的範圍

我正在爲使用createjs框架在javascript中製作的遊戲編寫場景結構。我遇到的問題是正確引用原型函數中的原始類。我相對較新的JavaScript，這是我第一次不得不使用原型。我當前的代碼如下：疑難解答原型類的範圍

function Intro(p, c){ 
    this.parent = p; 
    var s = new createjs.Stage(c); 
    this.stage = s; 

    this.queue = new createjs.LoadQueue(false); 
    this.queue.installPlugin(createjs.Sound); 
    this.queue.addEventListener("complete", this.handleComplete); 
    this.queue.loadManifest([{id:"bg", src:"images/Intro/intro_background.png"}]); 
} 
Intro.prototype.handleComplete = function(event){ 
    console.log("queue completed - handling..."); 
    var q = event.target; 
    var bg = new createjs.Bitmap(q.getResult("bg")); 
    this.stage.addChild(bg); 
    this.stage.update(); 
}

當我到

this.stage.addChild（BG）;

它似乎失去了範圍，我得到「無法調用未定義的方法‘的addChild’。

任何幫助將不勝感激！ -xv

來源

2013-09-23 user2807770

如果您在JS中調用函數，它將被動態綁定。什麼值將被綁定到this取決於你調用它的方式，函數是否被調用爲構造函數以及代碼是否以嚴格模式運行。

在你的情況，下面一行：

this.queue.addEventListener("complete", this.handleComplete);

讓你的函數與this綁定到全局對象運行（在Web瀏覽器中，全局對象是window對象），或者，如果在嚴格模式，this將是未定義的。

如@dystroy建議，使用bind()方法來更改此行爲。呼喚：

this.queue.addEventListener("complete", this.handleComplete.bind(this));

原因結合this的handleComplete()內到同一this在Intro。

如果你想更詳細地瞭解它。我強烈建議閱讀Dmitry Soshnikov's blog。

來源

2013-09-23 15:26:00 kamituel

你可以通過改變解決您的範圍問題

this.queue.addEventListener("complete", this.handleComplete);

到

this.queue.addEventListener("complete", this.handleComplete.bind(this));

，這樣綁定函數的範圍是this。

順便說一句，您可能會對我的遊戲感興趣，其中我重寫了createjs類（https://github.com/Canop/SpaceBullet/tree/master/src）。我認爲我以一種乾淨的方式處理了這個問題。

來源

2013-09-23 15:20:58

如果需要低於Internet Explorer 9兼容性，那麼可以看看jQueries .proxy（）。它做同樣的事情。 – Kayo

當他使用createjs時，我懷疑他擔心與IE8的兼容性。 –

非常感謝，我一定會考慮你是如何處理遊戲中的事情的！ – user2807770

疑難解答原型類的範圍

回答

相關問題