Javascript 箭头从另一个调用 function 与 functionName() vs ()=>functionName

Question

假设您有一个直到运行时才想调用的方法/函数。

const someMethod = () => {
  document.getElementById("myField").value = "Hello";
}

术语是什么，它们的执行方式有什么区别。

this.check(() => someMethod);

和

this.check(someMethod())

Answer 1

他们完全不同。

this.check(() => someMethod); 将传递一个回调，当被调用时（如果有的话），返回一个 function。

this.check(someMethod())将立即调用someMethod ，然后将结果传递给this.check方法。

另一个未列出的选项是this.check(() => someMethod()); ，它会在调用传递给check的回调时调用someMethod 。

如果this上下文是你担心的事情，那么：

this.check(someObj.someMethod)

将导致someMethod ，当被调用时，将被调用this ，无论check方法希望它是什么。 它不保留someObj的上下文。 相比之下

this.check(() => someObj.someMethod())

将导致someMethod被调用this的someObj ，无论check如何尝试调用它。

因此，通常，为了安全起见，您需要this.check(() => someObj.someMethod()) - 或提前绑定someMethod ，或使用箭头 function 而不是function声明someMethod 。

Answer 2

这里： this.check接收一个回调作为它的参数，它返回someMethod function。

this.check(() => someMethod);

在这种情况下： this.check接收someMethod返回的值作为其参数。

this.check(someMethod())