Javascript *不是函數（原型函數）

Question

來自C ++背景，嘗試使用沒有顯式輸入的OO語言僅是一件令人頭疼的事情。

因此，我擁有一個由對象“控制”的動態元素，因為我需要在每個元素上管理大量工作才能使其正常工作。 元素只是對象本身內部數據的可視輸出，這就是我真正需要的全部。

除了單擊該對象時，我需要該對象執行內部功能。 到目前為止，這似乎是我頭痛的最大原因。

Javascript：

function onClick(file) //The external onClick function I use to try to get it to call from. 
{
    file.state = INUSE;
    file.checkState();
}

function fileObject () { //The file object itself
    this.element;
    this.newElement();         
    //initialize stuff for the object
}

fileObject.prototype.newElement = function() { //creates a new element and sets its event listener
    this.element.click(function() {onClick(this)});
}

fileObject.prototype.checkState = function() {/*does stuff*/} //apparently this is "not a function"

我確切得到的錯誤是來自Firefox控制台面板的“ file.checkState不是函數”。

我對javascript還是很陌生，但是在進行了一些調試之后，我發現這顯然是導致所有錯誤的onClick(this)函數。 當與其他東西一起使用時， onClick函數可以完美地工作，但是由於某些原因， this關鍵字似乎並沒有真正發送對fileObject的引用，因為所有檢查都顯示在onClick范圍內時file undefined 。

我嘗試執行此操作的方式是否存在根本性的錯誤，或者我只是錯過了一個步驟（或添加了不需要的步驟）來幫助使此代碼段正常工作？

Answer 1

因此，您知道，最初的問題實際上不是處理操作，而是聽操作。 click將觸發綜合點擊事件，而不是列出一個事件。

您需要... .element.addEventListener("click", callback); 也就是說，此后您立即面臨第二個問題。 我將保留您編寫的示例代碼，以免引起混淆。

但是，當您看到click( )時，您知道我的意思是訂閱addEventListener ，如果element確實意味着瀏覽器DOM元素。 如果不是標准的瀏覽器元素和您自己的API，請忽略前面的部分並繼續。

this是在函數調用時動態綁定的（而不是在定義時綁定）。

范圍最接近的函數是傳遞給.click( ... )回調函數。

this與您在回調外部所指的完全不同。 點的左側上的任何內容都是該特定調用持續時間內的this上下文。

不用說， click()不知道夠使的this你的意思是，你的回調的左側。

解決方案（或許多解決方案之一）是使用詞法作用域和/或閉包來保留您所指對象的值。

// easy but messier
var fileObject = this;
... .click(function () { onClick(fileObject); });


// Cleaner with thunks:
function clickHandler (onClick, obj) {
  return function () { onClick(obj); };
}

... .click(clickHandler(this));

Answer 2

從C ++專程前來的Javascript處理this會顯得有點瘋狂，它看起來像在這里你需要告訴你的功能定義了什么this是-就像這樣：

this.element.click(function() {onClick(this)}.bind(this));