Var self=这个？

使用实例方法作为事件处理程序的回调会将this的范围从“我的实例”更改为“不管刚才叫回调的是什么”。所以我的代码看起来像这样

function MyObject() {
this.doSomething = function() {
...
}


var self = this
$('#foobar').bind('click', function(){
self.doSomethng()
// this.doSomething() would not work here
})
}

这很有效，但这是最好的方法吗？在我看来很奇怪。

115182 次浏览
小开

我认为这实际上取决于你要在doSomething功能中做什么。如果要使用此关键字访问MyObject属性，则必须使用该关键字。但我认为，如果您没有使用object(MyObject)属性做任何特殊的事情，下面的代码片段也可以工作。

function doSomething(){
.........
}


$("#foobar").ready('click', function(){


});
小开

是的，这似乎是一个共同的标准。一些程序员使用自我，另一些使用我。它被用作对“真实”对象的引用，而不是事件。

这是我花了一段时间才真正理解的东西，一开始看起来确实很奇怪。

我通常在对象的顶部执行此操作（请原谅我的演示代码-它比其他任何东西都更概念化，并且不是关于优秀编码技术的课程）：

function MyObject(){
var me = this;


//Events
Click = onClick; //Allows user to override onClick event with their own


//Event Handlers
onClick = function(args){
me.MyProperty = args; //Reference me, referencing this refers to onClick
...
//Do other stuff
}
}
小开

我没有使用过jQuery，但在像Prototype这样的库中，您可以将函数绑定到特定的范围。考虑到这一点，您的代码将如下所示：

 $('#foobar').ready('click', this.doSomething.bind(this));

Bind方法返回一个新函数，该函数使用您指定的范围调用原始方法。

小开
最佳答案

这个问题不是专门针对jQuery的，而是专门针对一般的JavaScript.核心问题是如何在嵌入式函数中“引导”变量。这是一个例子：

var abc = 1; // we want to use this variable in embedded functions


function xyz(){
console.log(abc); // it is available here!
function qwe(){
console.log(abc); // it is available here too!
}
...
};

这种技术依赖于使用闭包。但它不适用于this，因为this是一个伪变量，可能会随着作用域的不同而动态变化：

// we want to use "this" variable in embedded functions


function xyz(){
// "this" is different here!
console.log(this); // not what we wanted!
function qwe(){
// "this" is different here too!
console.log(this); // not what we wanted!
}
...
};

我们能做些什么？将其分配给某个变量，并通过别名使用它：

var abc = this; // we want to use this variable in embedded functions


function xyz(){
// "this" is different here! --- but we don't care!
console.log(abc); // now it is the right object!
function qwe(){
// "this" is different here too! --- but we don't care!
console.log(abc); // it is the right object here too!
}
...
};

this在这方面不是唯一的：arguments是另一个应以相同方式处理的伪变量&mdash；通过混叠。

小开 
var functionX = function() {
var self = this;
var functionY = function(y) {
// If we call "this" in here, we get a reference to functionY,
// but if we call "self" (defined earlier), we get a reference to function X.
}
}

编辑：尽管如此，对象中的嵌套函数采用全局窗口对象，而不是周围的对象。

小开

除此之外，在ES6中，由于箭头函数，您不需要这样做，因为它们捕获了this值。

小开

一种解决方案是使用JavaScript的bind方法将所有回调绑定到对象。

您可以使用命名方法执行此操作，

function MyNamedMethod() {
// You can now call methods on "this" here
}


doCallBack(MyNamedMethod.bind(this));

或使用匿名回调

doCallBack(function () {
// You can now call methods on "this" here
}.bind(this));

执行这些操作，而不是求助于var self = this，表明您了解this的绑定在JavaScript中的行为，并且不依赖于闭包引用。

此外，ES6中的胖箭头操作符基本上与匿名函数上的调用.bind(this)相同：

doCallback( () => {
// You can reference "this" here now
});
小开

如果你正在做ES2015或者做类型脚本和ES5，那么你可以在你的代码中使用箭头函数，你不会遇到这个错误，这指的是你在你的实例中想要的范围。

this.name = 'test'
myObject.doSomething(data => {
console.log(this.name)  // this should print out 'test'
});

解释一下：在ES2015中，箭头函数从其定义范围中捕获this。普通的函数定义不会这样做。


提交答案