在javascript中使用箭头函数进行回调

Question

假设有两个函数。

function foo(callback) { 
... 
} 

function bar() { 
... 
} 

有什么区别时，我打电话foo(bar)和foo(() => bar())假设酒吧不需要参数？

我最近前一个发生错误this上下文，而第二个工作正常。我知道箭头函数将this上下文绑定到函数中，我不知道有什么区别。

仅供参考，这里是有问题的代码。

socket.disconnect(socket.connect); // line 1 

socket.disconnect(() => socket.connect()); // line 2 

socket.disconnect(function() { socket.connect(); }); // line 3 

我刚发现问题可能与上下文无关。这可能是应用或绑定的东西。因为第2行和第3行工作正常，而只有第1行显示错误。

Answer 1

首先，你所描述的与箭头功能无关。

this的值取决于函数如何被称为。当一个函数是一个对象的属性并且被调用为foo.bar()时，foo.bar中的this将引用foo。

所以在你的最后两个例子中，this将引用socket而不是socket.connect。

在您的第一个示例中，this将引用另一个值，因为该函数不会作为socket的方法执行。但socket.connect可能预计有thissocket。

---

简单的例子：

function foo(callback) { 
 
    callback(); 
 
} 
 

 
var socket = { 
 
    connect() { 
 
    "use strict"; 
 
    console.log(this); 
 
    }, 
 
}; 
 

 
foo(socket.connect);     // undefined 
 
foo(() => socket.connect());   // socket object 
 
foo(function() { socket.connect()}); // socket object