在回调中调用另一个函数时，Fat Arrow与瘦箭头的上下文

Question

我有一个使用胖箭的事件：

$('#new-mail-addr').click (event) => @use_new_address(event)

这是它回拨的功能：

  use_new_address: (event) ->
    event.preventDefault()
    $('#mailing-address-div').hide()

这是另一个使用click事件但在同一个文件中带有一个瘦箭头的事件：

$(".helper-text-icon").click ()->
  modalId = $(this).data("modal-help-text-id")
  $("#" + modalId).modal("show")

是因为'this'，因为第一种情况是调用另一个函数，即将'this'的所有权转移到新的新函数？函数'use_new_address'是函数对象吗？我在这里查看了其他一些胖瘦的箭头答案，但我找不到这个具体案例的内容。

Answer 1

回答您的问题

  

是因为'this'，因为第一个场景是调用另一个函数，即将'this'的所有权转移到新的新函数？

没有。它用于确保this引用定义函数的上下文（对象），而不是调用它的上下文（事件）。根据上下文我的意思是关闭，但这个术语让大多数JS开发人员感到困惑。它是代码所在的最近的块/函数/对象/文件。

  

函数'use_new_address'是函数对象吗？

我不知道你的意思。它是在对象上定义的函数，这很明显，因为它使用:而不是=将函数分配给它的属性。

您的代码说明

coffeescript中的胖箭头将声明函数的上下文的this绑定到函数体。

通常，Jquery会将click事件的eventObject放入this上下文中以进行点击回调。但是在你的第一个例子中，胖箭头否定了这一点，并将this绑定为定义它的上下文：

$('#new-mail-addr').click (event) => @use_new_address(event)

当它调用的函数在一个对象上时，我将假设click事件绑定到该对象上下文中的元素。

  use_new_address: (event) ->
    event.preventDefault()
    $('#mailing-address-div').hide()

在此回调中，事件为eventObject，this是定义use_new_address的对象。

您可以将此缩短为：

use_new_address: (event) =>
  event.preventDefault()
  $('#mailing-address-div').hide()

和

$('#new-mail-addr').click @use_new_address

在第二个示例中，您不使用传递给click事件的event对象，而是使用this，默认情况下是JQuery中的eventObject。

$(".helper-text-icon").click ()->
  modalId = $(this).data("modal-help-text-id")
  $("#" + modalId).modal("show")

TLDR;

在Coffeescript中有很多关于胖箭的好读物，例如看一下this。

并询问开发人员（如果您了解他们）编写此代码以解释其工作原理。