5

我是 coffescript 的新手,但我很感兴趣将事件从 jquery 绑定到 coffeescript 类实例的最佳方法是什么?我试图防止在我的班级中有太多的嵌套回调:

class Page
  id2clicks : 0
  id3clicks : 0
  id4clicks : 0

  onLoad: ->

    $('#id2').on 'click', @ , @onId2Click

    $('#id3').on 'click', $.proxy(@onId3Click,@)

    $('#id4').on 'click' , () =>
      @id4clicks++
      alert @id4clicks

  onId2Click: (e) ->
    e.data.id2clicks++
    alert e.data.id2clicks

  onId3Click: ->
    @id3clicks++
    alert @id3clicks

p = new Page()
p.onLoad()

所有 3 种方法都有效......有没有更好的方法/建议来做到这一点?

4

3 回答 3

3

就我个人而言,我更喜欢这种方式,因为它是最短的并且可以直接显示处理程序(注意我也省略了括号):

$('#id4').on 'click' , =>
  @id4clicks++
  alert @id4clicks

这对于短处理程序非常有用。但是,有时您有一个想要拆分并在其他地方重用的功能,在这种情况下,我更喜欢使用类似的东西

$('#id2').on 'click', $.proxy(@onId2Click, @)

甚至

$('#id2').on 'click', (e) =>
  @onId2Click e

另一种方法是写

onId3Click: =>
  @id3clicks++
  alert @id3clicks

并使用

$('#id3').on 'click', @onId3Click

但我个人不鼓励这样做,因为大多数人不希望@onId3Click成为绑定函数,它会迫使他们跳转到定义检查的代码部分。

于 2013-08-14T18:51:22.267 回答
2

CoffeeScript 专门针对这个问题引入了一整段语法:胖箭头,=>. 用它:

$('#id4').click (event) =>
  @id4clicks++
  alert @id4clicks
于 2013-08-14T18:54:01.510 回答
1

jsperf.com 对绑定方法的测试有 23 个(并且还在增加)修订版

http://jsperf.com/bind-vs-jquery-proxy/23

执行此绑定的其他方法包括:

$('#id3').on 'click', @onId3Click.bind(@)  # native bind

$('#id3').on 'click', _.bind(@onId3Click, @) # underscore, lodash

一般$.proxy和underscore比较慢,native bind在一些浏览器上快,在V8上慢,lodash可以区分两者。

于 2013-08-15T17:31:59.723 回答