CoffeeScript中的函数声明

Question 1

我注意到在CoffeeScript中，如果我使用以下方法定义函数：

a = (c) -> c=1

我只能得到函数表达式：

var a;
a = function(c) {
    return c = 1;
};

但是，我个人经常使用函数声明，例如：

function a(c) {
    return c = 1;
}

我确实使用第一种形式，但是我想知道CoffeeScript中是否有一种方法来生成函数声明。如果没有这种方法，我想知道为什么CoffeeScript避免这样做。只要函数在范围的顶部声明，我认为JSLint不会大声声明错误。

Question 2

CoffeeScript仅在一个地方使用函数声明（也称为“命名函数”）：class定义。例如，

class Foo

编译为

var Foo;
Foo = (function() {
  function Foo() {}
  return Foo;
})();

根据FAQ，CoffeeScript在其他地方不使用函数声明的原因：

怪微软这个。最初，每个可能具有合理名称的函数都被赋予了一个名称，但是IE 8及更低版本具有范围问题，其中将命名函数同时视为声明和表达式。请参阅此以获取更多信息。

简而言之：不小心使用函数声明会导致IE（9级之前）和其他JS环境之间的不一致，因此CoffeeScript避免使用它们。

Question 3

是的你可以：

hello()

`function hello() {`
console.log 'hello'
dothings()
`}`

您可以通过反引号`

请注意，您不能在函数主体上缩进。

干杯

Question 4

CoffeeScript要牢记的一件事是，您始终可以重新使用JavaScript。虽然CoffeeScript不支持命名函数声明，但是您始终可以退回到JavaScript来做到这一点。

http://jsbin.com/iSUFazA/11/edit

# http://jsbin.com/iSUFazA/11/edit
# You cannot call a variable function prior to declaring it!
# alert csAddNumbers(2,3) # bad!

# CoffeeScript function
csAddNumbers = (x,y) -> x+y

# You can call a named function prior to
# delcaring it
alert "Calling jsMultiplyNumbers: " + jsMultiplyNumbers(2,3) # ok!

# JavaScript named function
# Backticks FTW!
`function jsMultiplyNumbers(x,y) { return x * y; }`

您还可以在CoffeeScript中编写一个大胖函数，然后使用反引号技巧让JavaScript调用另一个函数：

# Coffeescript big function
csSomeBigFunction = (x,y) ->
   z = x + y
   z = z * x * y
   # do other stuff
   # keep doing other stuff

# Javascript named function wrapper
`function jsSomeBigFunction(x,y) { return csSomeBigFunction(x,y); }`

Question 5

不，您不能在coffee脚本中定义一个函数，而让它在coffee脚本中生成一个函数声明

即使你写

-> 123

生成的JS将被包装在括号中，从而使其成为函数表达式

(function() {
  return 123;
});

我的猜测是，这是因为函数声明“悬挂”在了封闭范围的顶部，这将破坏coffeescript源的逻辑流程。

Question 6

虽然这是一篇较旧的文章，但我想在对话中添加一些内容，以便将来的Google员工使用。

OP是正确的，因为我们不能在纯CoffeeScript中声明函数（不包括使用反引号在CoffeeScript文件中转义纯JS的想法）。

但是我们可以做的是将函数绑定到窗口，并最终得到可以调用的东西，就好像它是命名函数一样。我不是在说这是一个命名函数，而是提供一种使用纯CoffeeScript进行OP实际想做的事情的方法（在代码中的某个地方调用foo（param）之类的函数）。

这是一个附加到coffeescript窗口中的函数的示例：

window.autocomplete_form = (e) ->
    autocomplete = undefined
    street_address_1 = $('#property_street_address_1')
    autocomplete = new google.maps.places.Autocomplete(street_address_1[0], {})
    google.maps.event.addListener autocomplete, "place_changed", ->
        place = autocomplete.getPlace()

        i = 0

        while i < place.address_components.length
            addr = place.address_components[i]
            st_num = addr.long_name if addr.types[0] is "street_number"
            st_name = addr.long_name if addr.types[0] is "route"

            $("#property_city").val addr.long_name if addr.types[0] is "locality"
            $("#property_state").val addr.short_name if addr.types[0] is "administrative_area_level_1"
            $("#property_county").val (addr.long_name).replace(new RegExp("\\bcounty\\b", "gi"), "").trim() if addr.types[0] is "administrative_area_level_2"
            $("#property_zip_code").val addr.long_name if addr.types[0] is "postal_code"
            i++

        if st_num isnt "" and (st_num?) and st_num isnt "undefined"
            street1 = st_num + " " + st_name
        else
            street1 = st_name

        street_address_1.blur()
        setTimeout (->
            street_address_1.val("").val street1
            return
            ), 10
        street_address_1.val street1
        return

这是使用Google地方信息返回地址信息以自动填充表格。

因此，我们有一个正在加载到页面中的Rails应用程序中的一部分。这意味着已经创建了DOM，并且如果我们在初始页面加载时调用上述函数（在ajax调用呈现部分函数之前），则jQuery将不会看到$（'＃property_street_address_1'）元素（相信我-它没有t）。

因此，我们需要将google.maps.places.Autocomplete（）延迟到该元素出现在页面上之后。

我们可以在部分加载成功时通过Ajax回调来实现：

            url = "/proposal/"+property_id+"/getSectionProperty"
            $("#targ-"+target).load url, (response, status, xhr) ->
                if status is 'success'
                    console.log('Loading the autocomplete form...')
                    window.autocomplete_form()
                    return

            window.isSectionDirty = false

因此，在本质上，我们在做与调用foo（）相同的操作

Question 7

为什么？因为函数声明是邪恶的。看这段代码

function a() {
        return 'a';
}

console.log(a());

function a() {
        return 'b';
}

console.log(a());

输出结果是什么？

b
b

如果我们使用函数定义

var a = function() {
        return 'a';
}

console.log(a());

a = function() {
        return 'b';
}

console.log(a());

输出为：

a
b

Question 8

尝试这个：

defineFct = (name, fct)->
  eval("var x = function #{name}() { return fct.call(this, arguments); }")
  return x

现在，以下内容将显示“ true”：

foo = defineFct('foo', ()->'foo')
console.log(foo() == foo.name)

我实际上并不使用此功能，但有时确实希望咖啡功能具有自省名称。