jQuery / JavaScript“这个”指针混淆

当这个functionbar被调用时，“this”的行为让我感到困惑。 请参阅下面的代码。 有没有什么办法来安排“这个”是一个简单的老js对象实例时，从一个点击处理程序调用栏，而不是HTML元素？

 // a class with a method function foo() { this.bar(); // when called here, "this" is the foo instance var barf = this.bar; barf(); // when called here, "this" is the global object // when called from a click, "this" is the html element $("#thing").after($("<div>click me</div>").click(barf)); } foo.prototype.bar = function() { alert(this); } 

Answer 1

欢迎来到JavaScript的世界！ ：d

你已经进入了JavaScript范围和closures领域。

简短的回答：

 this.bar() 

是在foo的范围内执行的（因为这是指foo ）

 var barf = this.bar; barf(); 

在全球范围内执行。

这个.bar基本上是指：

在this （foo）的范围内执行this.bar所指向的函数。 当您将this.bar复制到barf并运行barf时。 Javascript理解为，运行barf指向的函数，并且因为没有这个 ，所以它只运行在全局范围内。

要改正这一点，你可以改变

 barf(); 

像这样的东西：

 barf.apply(this); 

这告诉Javascript在执行它之前将这个范围绑定到barf。

对于jQuery的事件，你将需要使用匿名函数，或扩展在原型的绑定function，以支持范围。

欲了解更多信息：

• 好的解释范围
• 扩展jQuery绑定到supportscoping

Answer 2

在QuirksMode提供的JavaScript中有一个很好的解释。

Answer 3

你可能会发现这个：

在jQuery事件中控制“this”的值

或这个：

http://www.learningjquery.com/2007/08/what-is-this

有用。

Answer 4

获取书：JavaScript：好的部分。

此外，尽可能多地阅读Douglas Crockford http://www.crockford.com/javascript/

Answer 5

你可以在Function.apply上使用Function.apply来设置this应该引用的内容：

 $("#thing").after($("<div>click me</div>").click(function() { barf.apply(document); // now this refers to the document }); 

Answer 6

这是因为这总是该函数所附带的实例。 在EventHandler的情况下，它是触发事件的类。

你可以用这样的匿名函数来帮助你自己：

 function foo() { var obj = this; $("#thing").after($("<div>click me</div>").click(function(){obj.bar();})); } foo.prototype.bar = function() { alert(this); } 

Answer 7

 this.bar(); // when called here, "this" is the foo instance 

当foo被用作普通函数而不是构造函数时，这个注释是错误的。 这里：

 foo();//this stands for window