Javascript这并不指向正确的对象

Sample code:

function TestClass() {

this.init = function() {

    this.updateHeader(); // <-- error line

};

this.updateHeader = function() {
    console.log("Works");
};

};
var test = new TestClass();
$(document).ready(test.init);

When I run that in Firefox 3.5, Firebug gives me an error, saying that this.updateHeader is not a valid function. I'm a Java/PHP programmer and having some trouble understanding the Javascript OO-model. What am I doing wrong?

当我在Firefox 3.5中运行它时,Firebug给我一个错误,说this.updateHeader不是一个有效的函数。我是一名Java / PHP程序员,在理解Javascript OO模型时遇到一些麻烦。我究竟做错了什么?

It does work if I replace the $(document).ready-line with simply test.init(), but I don't want that.

如果我用test.init()替换$(document).ready-line,它确实有效,但我不希望这样。

4 个解决方案

#1

By passing the function test.init directly to the ready() function, you are registering test.init as a callback function. jQuery (which, judging from your syntax, you're using) will use the callback function that it is given and apply it in the context of document. This means that the this keyword will refer to the document.

通过将函数test.init直接传递给ready()函数,您将test.init注册为回调函数。 jQuery(从你的语法判断,你正在使用)将使用它给出的回调函数并将其应用于文档的上下文中。这意味着this关键字将引用该文档。

What you should do to avoid this, as suggested, is use an anonymous function (closure) that will call the function you are referring to:

根据建议,你应该做些什么来避免这种情况,使用一个匿名函数(闭包)来调用你所指的函数:

$(document).ready(function() {
    test.init();
});

Using the function() { } syntax to define closures to be set as callback functions is a common pattern in Javascript.

使用function(){}语法来定义要设置为回调函数的闭包是Javascript中的常见模式。

#2

Supplying test.init to the document ready function is really feeding it a function pointer to the init function in test.

将test.init提供给文档就绪函数实际上是为测试中的init函数提供了一个函数指针。

Essentially it is ripping out the init function and executing it in the scope of the document ready function.

本质上,它正在剥离init函数并在文档就绪函数的范围内执行它。

If you ran it as $(document).ready(function () { test.init(); } ); (As Patrick stated) it will execute in the proper scope.

如果你把它作为$(document).ready(function(){test.init();})运行; (正如帕特里克所说)它将在适当的范围内执行。

#3

The "this" in that context is scoped to the function it is contained within.

该上下文中的“this”的范围限定在其包含的函数中。

#4

Try $(document).ready(function () { test.init(); });

尝试$(document).ready(function(){test.init();});

ready() expects a function as an argument, which it will execute when the document is ready. When it does, this will point to the document object, not test.

ready()期望函数作为参数,它将在文档准备好时执行。如果是这样,这将指向文档对象,而不是测试。

The solution is to pass it a function that explicitly calls init with the code, test.init(). When you call it that way, this (in the init function) points to your test object.

解决方案是向它传递一个函数,该函数使用代码test.init()显式调用init。当你这样调用它时,这(在init函数中)指向你的测试对象。

#1