我如何在浏览器中使用CoffeeScript正确地作用域函数

How do I properly scope functions with CoffeeScript in browser?

本文关键字：CoffeeScript 正确地 作用域 函数 浏览器      更新时间：2023-09-26
(->
  jQuery ->
    globalThis = @
    $('#emailTypes').change ->
      globalThis.toggleEmailOptions()
  toggleEmailOptions = ->
    $('.emailTypeOptions').fadeOut 'fast', ->
      for emailType in $('#emailTypes').val()
        $("##{emailType}Options").fadeIn()

).call this

这是我的.coffee文件。但是，toggleEmailOptions函数不在jQuery ready的范围内。我怎样才能使它在范围内?

From http://jashkenas.github.com/coffee-script/

关于CoffeeScript的通常警告适用-您的内联脚本将适用在闭包包装器中运行，所以如果您想公开全局变量或函数，将它们附加到window对象。

或者绑定到exports如果你使用node.js。

对于你的例子，它变成了:

window.toggleEmailOptions = ->

我认为你不需要换行，因为coffeescript已经这样做了，下面是我将如何重写你的代码:

jQuery ->
  toggleEmailOptions = ->
    $('.emailTypeOptions').fadeOut 'fast', ->
      for emailType in $('#emailTypes').val()
        $("##{emailType}Options").fadeIn()
  $('#emailTypes').change ->
    toggleEmailOptions()

这里有几个问题。一个是，你似乎是假设@/this是全局对象(window)从jQuery回调。但是很容易看出它不是:

jQuery -> console.log @ is window  # false

请记住，回调函数可以在标准库需要的任何上下文中调用。在本例中，@为document。document.toggleEmailOptions不存在

此外，如果您希望toggleEmailOptions是全局的，您需要将其附加到window(或@/this，因为@ is window在您的文件的最外层作用域)。这是因为当您只编写toggleEmailOptions = ...时，CoffeeScript使用var声明将其限定在文件内。通过查看编译后的JS很容易看出这一点:var总是在其作用域的顶部。幸运的是，无论如何，文件作用域是您想要的。

所以基本上:不要想太多!你想要的是: 
jQuery ->
  $('#emailTypes').change ->
    toggleEmailOptions()
相关文章：