Coffeescript 类和范围以及粗细箭头答案

【问题标题】：Coffeescript classes and scope and fat and thin arrowsCoffeescript 类和范围以及粗细箭头
【发布时间】：2011-10-19 23:09:22
【问题描述】：

在咖啡脚本类的胖箭头函数中，如何访问该类的范围以及函数？

例子：

class Example
  foo: ->
    $('.element').each =>  # or ->
      @bar($(this))        # I want to access 'bar' as well as the jquery element
  bar: (element) ->
    element.hide()

所以在本例中，如果我使用 =>，那么 @ 指的是类的 this，但 'this' 是错误的，而如果我对 each 使用 ->，那么 'this' 是范围正确，但是如何引用类函数栏？

谢谢！

【问题讨论】：

我找到了一个临时解决方案：使用 -> 然后使用 Example::bar 引用 bar。它有效，但它很丑。谁有更漂亮的解决方案？

标签： coffeescript scope arrow-functions

【解决方案1】：

检查不同的解决方案后。在这里，我看到了最完整的示例，然后单击：

class MainApp
  self = []

  constructor: ->
    self = @

  toDoOnClick: (event) ->
    self.bar($(event.target)) #hide the clicked object

  bar: (element) ->
    element.hide()

  sampleMethod:->
    $(".myDiv").click (e) -> self.toDoOnClick(e)
    $('.element').each ->
      self.bar($(this))

【讨论】：

【解决方案2】：

虽然 mak 是对的，但他没有指出在咖啡脚本中您很少需要 jQuery 的 each 方法，正如您所注意到的，它会在未经您许可的情况下猛击您的执行上下文。

class Example
  foo: ->
    for element in $('.element')
      @bar $(element)

  bar: (element) ->
    element.hide()

Coffee 脚本的循环功能支持each 的概念，根本不需要任何实际的自定义库代码。而且它们也不会生成新的范围或上下文，这意味着您不需要任何类型的粗箭头。

【讨论】：

好东西 Squeegy！你完全正确。我已将 mak 的答案保留为已接受的答案，但您的方式要整洁得多 - 也是要走的路。我通过转换一些旧的 js 开始使用咖啡脚本，这就是为什么我会遇到这个问题，但现在我知道得更好了。谢谢。

【解决方案3】：

这是因为在 CoffeeScript 中 @ 是 this 的别名，即当您将 .coffee 编译为 .js 时，@ 将被替换为 this。

如果Example::bar 很丑，我认为没有“更漂亮”的解决方案。

您可以在调用.each 之前存储对this 的引用：

class Example
  foo: ->
    self = @
    $('.element').each ->
      self.bar($(this)) # or self.bar($(@))
  bar: (element) ->
    element.hide()

【讨论】：

谢谢麦。好答案。这表明我没有遗漏一些明显的东西，而且我喜欢 self = @ 选项。我应该想到的。还是习惯了，还是喜欢。
在单独的注释（风格）上，您如何看待语法 ($ '.foo') 而不是 $('.foo') ？ Topfunky 试图推动第一种风格，但我还没有决定......