從html動態調用javascript對象函數

Question

我正在開發一種基於JavaScript文本的JavaScript游戲引擎。 我有一個帶有“ onuse”方法的javascript對象。 當我像這樣使用它時，它的運行效果非常好：

var button = new CanvasObject();
button.text = "test" // Necessary for the next code sample
button.onuse = function(){ button.x += 1 }; // Some simple reaction;

我在Canvas對象中有代碼，在繪制CanvasObject時會將其包裝在span標簽中，如下所示：

<span onclick = "function{ button.x += 1 }">test</span>
// Or to make the HTML cleaner:
<span onclick = canvas.callFunction(5)>test</span>
// where canvas.callFunction will call the function needed.
// Canvas keeps an array of functions that can be called.

Canvas將調用該函數，並且由於它使用“絕對”術語，因此行“ button.x + = 1”可以正常工作。 問題是我有另一個從CanvasObject擴展的類，例如ButtonObject。 我希望類定義具有已定義的onuse函數。 例如（使用此處列出的繼承技術）

ButtonObject.method('onuse', function(){
   this.x++; // Some function requiring 'this'.
});

當我使用第一種技術從HTML調用函數時，我的引擎會將其作為匿名函數調用。 然后，“ this”將被定義為窗口。 我希望每個ButtonObject實例都具有相同的“ onuse”功能，因此每次像對CanvasObject所做的那樣定義它似乎都需要很多額外的代碼。 我想到的一種可能的解決方案是修改引擎的工作方式，以便為每個對象賦予一個“名稱”屬性，該屬性等同於它的javascript名稱。 這樣，引擎可以簡單地像這樣寫字符串：

innerHTML += ( "<span onclick=' + buttonObjectInstance.name + ".onuse()'>" );

但是，這種技術要求我每次實例化對象時都兩次聲明該對象的名稱，如下所示：

var startButton = ButtonObject('startButton');

這真的是我唯一的選擇嗎？ 還是有辦法在沒有對象名稱的情況下在對象的上下文中調用函數？

Answer 1

綁定一個函數到以后：

ButtonObject.method('onuse', function(){
   this.x++; // Some function requiring 'this'.
} .bind(ButtonObject)  );

如果調用上下文中不是ButtonObject，則將其綁定到保存您方法的任何對象。