Question

您好我是Js和Coffeescript的新手，我觉得很难在以下示例中引用父对象的属性App

App =
  init: ->
    this.foo = 'bar'
    this.bindEvent()
  bindEvent: ->  
    $('#test').click(this.show)
  show: ->
    alert this.foo

App.init()

我认为胖箭可以做到这一点但是一旦我改为show: =>，this方法在show方法的上下文中引用了窗口对象，而不是{{ 1}}我想要的对象。有谁能告诉我该怎么做？

http://jsfiddle.net/kZpHX/

Answer 1

当您定义show功能时，@（AKA this）实际上是window所以

show: => console.log(@)

会将show绑定到window。问题是你只是定义一个对象，所以没有任何东西可以绑定：你没有定义一个类，所以this是window。您可以明确地引用App：

App =
  #...
  show: -> alert(App.foo)

演示：http://jsfiddle.net/ambiguous/3sRVh/

this.foo中的init会做正确的事情，因为说App.init()会设置预期的this。

您也可以手动连接所需的this：

bindEvent: ->
  $('#test').click => @show()

# or
bindEvent: ->
  _this = @ # JavaScript style
  $('#test').click -> _this.show()

演示：http://jsfiddle.net/ambiguous/byL45/，http://jsfiddle.net/ambiguous/MT8fG/

或者您可以为您的应用创建一个类：

class App
  constructor: ->
    @foo = 'bar'
    @bindEvent()
  bindEvent: ->  
    $('#test').click(@show)
  show: =>
    console.log(@foo)

new App

这样你的show: =>就会按照你期望的方式行事。

演示：http://jsfiddle.net/ambiguous/byatH/

如何使用Coffeescript胖箭头在事件处理程序中引用父对象

1 个答案: