1、The Little Book on CoffeeScript - 语法island205 2012-02-14 1925简介本文译自 The Little Book on CoffeeScript 的第2章。该书是 GitHub 上的一个开源项目,采用 MIT 授权协议。遂将其翻译过来,以便方便更多人接触 CoffeeScript,沿用 MIT 授权协议。译文有不妥之处,请指正。CoffeeScript 语法首先,在开始本章之前,我还想重申下尽管很多时候 CoffeeScript 的语法与 JavaScript相似,但是它并不是 JavaScript 的超集,因此,例如 function 和
2、 var 这类 JavaScript 关键字并不允许在 CoffeeScript 中使用。如果你正在编写 CoffeeScript 文件,里面必须完全是纯 CoffeeScript 代码,你不能把这两种语言揉到一起。为什么 CoffeeScript 不是超集?阻止其成为超集最直接的原因是在 CoffeeScript 程序中空格是有意义的。而且,既然已经这么决定了,开发团队也帮你一干到底,以精简的名字代替 JavaScript 的一些关键字和特性,还为避免很多常见的 bug 而努力。让我极度兴奋的是,从元的角度上来说,CoffeeScript 的解释器实际上就是由CoffeeScript 写成的
3、。这看起来似乎解决了先有鸡还是先有蛋的悖论!好了,让我们从最基本的工作开始。CoffeeScript 去掉了分号,它会在编译时为你自动添加。分号在 JavaScript 社区中引起了大量的争论,以及背后的一些解释器怪异的行为。总之,CoffeeScript 为了帮你解决这个问题,简单地从语法上的移除了分号,然后在幕后更具需要添加。注释格式与 Ruby 的一致,以一个哈希字符开头。# A comment也支持多行注释,而且还会把多行注释添加到生成的 JavaScript 中。使用三个哈希字符包裹即可。#A multiline comment, perhaps a LICENSE.#正如我简单的提
4、过,CoffeeScript 对空格是敏感的。实际说来,就是你可以使用制表符来替换花括号() 。这受到了 Python 语法的影响,而且还能确保你的脚本有一个清晰的格式,否则连编译都通不过。变量与作用域CoffeeScript 修复了 JavaScript 中一个最让人头疼的问题 全局变量。在 JavaScript中,一不小心的话,就很容易在定义变量时遗漏 var 关键字导致产生全局变量。CoffeeScript 通过简单的剔除全局变量来解决这个问题。在背后,CoffeeScript 使用一个匿名函数把所有脚本都包裹起来,将其限定在局部作用域中,并且为所有的变量赋值前自动添加 var。比如,下
5、面是在 CoffeeScript 中简单的定义一个变量:myVariable = “test“注意示例代码右上角的深灰色小方块。单击它,代码就会在 CoffeeScript 和编译后的JavaScript 之间来回切换。这是在页面加载是输出的,所以你放心,编译结果是准确的。如你所见的那样,变量赋值被限定在局部作用域中,不小心创建全局变量是不可能的。CoffeeScript 还更进了一步,让覆盖一个高一级的变量也很困难。这大量的减少了程序员会在 JavaScript 中犯的常见的错误。然而,有时候全局变量还是有用的。你可以通过直接给全局对象(浏览器中的 window)赋值来获得全局变量,也可以通
6、过下面这种模式。exports = thisexports.MyVariable = “foo-bar“在顶级作用域中,this 就相当于全局对象,你可以创建一个局部变量 exports 让阅读你代码的人能够分清楚哪个是脚本创建的全局变量。而且,这还能为支持 CommonJS 模块铺平了道路,这在本书的后面会做介绍。函数CoffeeScript 移除了冗长的 function 语句,以瘦箭头-替之。函数可以是一行也可以是多行。函数的最后一个表达式会作为隐式的返回值。换句话说,你不再需要使用 return 关键字,除非你想早一点从函数中返回。记住这点,让我们看一个例子:func = - “bar
7、“结合着编译后的 JavaScript 你会发现,-被转成了一个 function 表达式,并且“bar“被自动的返回了。前面也说了,没有理由阻止我们使用多行的函数,只需要适当地缩进函数体即可:Func = -# An extra line“bar“函数参数如何指定参数?CoffeeScript 允许你通过在箭头前面的括号中指定参数。times = (a, b) - a * bCoffeeScript 还支持默认参数,例如:times = (a = 1, b = 2) - a * b你还可以使用参数槽(splats)接收多个参数,使用.表示:sum =(nums.) -result = 0nu
8、ms.forEach(n) - result +=n result在上面的例子中,nums 是一个包含传递给函数全部参数的数组。它不是一个 arugments 对象,而是一个真实的数组对象,这样的话在你想操作它的时候就不需要先使用Array.prototype.splice 或者 jQuery.makeArray()了。trigger = (events.) -events.splice(1, 0, this)this.constructor.trigger.apply(events)函数调用在 JavaScript 中,可以通过括弧()、apply()和 call()来调用函数。然而,像 R
9、uby 一样,如果函数被至少一个参数跟着的话,CoffeeScript 会自动的调用这个函数。a = “Howdy!“alert a# Equivalent to:alert(a)alert inspect a# Equivalent to:alert(inspect(a)尽管括号不是必须的,但是在难以分清谁是被调用的函数哪些是参数时,我推荐还是用上括号。上一个 inspect 的示例中,我真心建议你至少使给 inspect 的调用加上括号。alert inspect(a)如果在调用一个函数时你没有传递参数,CoffeeScript 就没有办法判断出你打算调用这个函数,还是只是把它当作一个变量
10、。从这点来看,CoffeeScript 的行为与 Ruby 有些差异,后者总是会调用引用函数的变量,CoffeeScript 更像 Python。这已经变成了我的CoffeeScript 程序中常见的错误。因此,在你打算无参数调用函数时多留个心眼,别忘了加上括号。函数上下文在 JavaScript 上下文会频繁的变化。尤其是在回调函数中,CoffeeScript 为此提供了一些辅助。其中之一就是-的变种胖箭头的函数=使用胖箭头代替普通箭头是为了确保函数的上下文可以绑定为当前的上下文。例如:this.clickHandler = - alert “clicked“element.addEvent
11、Listener “click“, (e) = this.clickHandler(e)你之所以要这样做的原因是,来自 addEventListener 的回调函数会以 element 为上下文被调用,也就是说,this 就相当于这个元素。如果你想让 this 等于当前上下文,除了使用self=this,胖箭头也是一种方式。这中绑定的思想与 jQuery 的 proxy()或者 ES5s 的 bind()函数是类似的概念。对象字面量与数组定义就如在 JavaScript 中一样,可以使用一对大括号以及键/值来明确定义对象字面量。然而,与函数调用类似,CoffeeScript 使得可以省略括号。
12、事实上,你还可以使用缩进和换行来代替起分割作用的逗号。object1 = one: 1, two: 2# Without bracesobject2 = one: 1, two: 2# Using new lines instead of commasobject3 = one: 1two: 2User.create(name: “John Smith“)同样的,数组可以使用空格来代替分隔作用的逗号,但是方括号()还是需要的。array1 = 1, 2, 3array2 = 123array3 = 1,2,3,像你在上例看到的那样,CoffeeScript 还能去掉 array3末尾多余的逗号
13、,这也是一个常见的跨浏览器错误源。流程控制这种可省略括号的便捷方式延续到了 CoffeeScript 中的 if 和 else 关键字。if true = true“Were ok“if true != true then “Panic“# Equivalent to:# (1 0) ? “Ok“ : “Y2K!“if 1 0 then “Ok“ else “Y2K!“如你所见,在单行的 if 语句中,你需要使用 then 关键字,这样 CoffeeScirpt 才能明白执行体从什么地方开始。CoffeeScript 并不支持条件运算符,作为替代你应该使用单行的if/else 语句。Coffe
14、eScript 还支持一项 Ruby 的特性,即运行在 if 语句前使用前缀表达式。alert “Its cold!“ if heat records0在 JavaScript 中使用 if 来做 null 检查是很常见的,但是其中有几个陷阱,空字符串和零都被强制转化为 false,这往往会让你犯错。CoffeeScript 存在操作符? 只会在变量为 null 或者 undefined 的时候会返回真,与 Ruby 的 nil?类似。praise if brian?你还能用它来替换|操作符:velocity = southern ? 40如果你在访问属性之前进行 null 检查,你可以把存在操作符放在它左边来跳过检查。这与Actice Support 的 try 方法比较类似。blackKnight.getLegs()?.kick()你能够用同样的方法检查一个属性是否是函数,是否可以调用,把存在操作符放在括号之前就行。如果属性不存在,或者不是一个函数,则就不会被调用。blackKnight.getLegs().kick?()此文章来自译言网 http:/article.yeeyan.org/view/260164/251746本人自行加入编译过的 javascript 代码。本着好东西共享的原则,特此分享