使用“this”调用回调函数的正确方法

Question

这个上下文对于使用正确的“this”上下文调用回调函数是否有效？

data.on('load', doSomething.call(this));

或者使用额外的箭头功能会更好（是的，我正在使用babel进行编译。

data.on('load', () => {
  doSomething.call(this);
});

两者似乎在Chrome中都有相同的结果，但尚未检查其他浏览器。是否有最好的做法，或者是一种比另一种更好的支持方式？

Answer 1

以下内容将立即调用doSomething，并将返回的值指定为事件侦听器：

data.on('load', doSomething.call(this));

您可能需要bind代替：

data.on('load', doSomething.bind(this));

你的箭头功能也可以。

Answer 2

您需要使用期望的this值创建一个函数。

bind创建一个稍后调用的函数，call只调用该函数并给出结果。

data.on('load', doSomething.bind(this));

要回答关于箭头语法的问题，虽然它在功能上类似于call：()=> { doSomething.call(this) }，但生成的代码还有一层额外的闭包。

function() {
    doSomething.call(this);
}.bind(this);

这样做会有很小的性能损失，但应该可以忽略不计。