在咖啡脚本主干代码中找到@符号和“->”和“=>”的含义

Posted 2023-03-03

【中文标题】在咖啡脚本主干代码中找到@符号和“->”和“=>”的含义

【英文标题】：meaning of @ sign and "->" and "=>" found in coffee script backbone code

【发布时间】：2019-11-13 07:21:32

【问题描述】：

的意义/意义是什么 @前缀 -> 和 => 之间的区别

我可以找到一些文档吗？ 这些特殊字符很难用谷歌搜索，所以我在这里问。 [full gist]

class RP.Dashboard.Events.Form extends Backbone.View
  el: '.simple_form.new_event, .simple_form.edit_event, .simple_form#new_event, .simple_form#edit_event'
  events:
    'focus #location_autocomplete': 'geolocate'
  address_component_map:
    street_number:
      key: 'short_name'
      form_field: '#event_address'


  initialize: ->
    @render()
    @init_autocomplete()

  render: ->
    @$(".datepicker" ).datepicker(
      showOn: "button"
      buttonImageOnly: true
      changeMonth: true
      changeYear: true
      format: 'yyyy-mm-dd'
      dateFormat: 'yy-mm-dd'
    )
    @$(".timepicker").timepicker()
    @$('.input-timepicker').timepicker(minuteStep: 1,showSeconds: false,showMeridian: true,defaultTime: '8');


  fill_in_address: =>

【问题讨论】：

也许official CoffeeScript 文档会有所帮助。

【参考方案1】：

谷歌搜索“coffeescript at sign”将Does the '@' symbol have special meaning in javascript, Coffeescript or Jquery? 列为最佳结果。 @ 在咖啡脚本中表示 this：

## coffeescript
self = @ 

## javascript
var self = this

关于 -> 和 => 之间的区别，谷歌搜索“cofeescript ->”会返回此作为顶部链接：

CoffeeScript, When to use fat arrow (=>) over arrow (->) and vice versa

从那里复制和粘贴：

我在定义方法时发现的胖箭头的主要用例是当您想将方法用作回调并且该方法引用实例字段时：

class A
  constructor: (@msg) ->
  thin: -> alert @msg
  fat:  => alert @msg

x = new A("yo")
x.thin() #alerts "yo"
x.fat()  #alerts "yo"

fn = (callback) -> callback()

fn(x.thin) #alerts "undefined"
fn(x.fat)  #alerts "yo"
fn(-> x.thin()) #alerts "yo"

如您所见，如果您不使用粗箭头，则可能会遇到将实例方法的引用作为回调传递的问题。这是因为胖箭头将对象的实例绑定到 this 上，而细箭头没有，所以上面调用为回调的细箭头方法不能访问实例的字段，如 @msg 或调用其他实例方法。最后一行是针对使用细箭头的情况的解决方法。

【讨论】：

是的@表示this，但是当它用作变量的前缀时呢？

@CodyBugstein@variable = this.variable