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));