CoffeeScript – 未来可以取代 JavaScript 的语言

by Bruce Dou

at 2011-09-01 14:56:17

original http://blog.eood.cn/coffeescript

CoffeeScript 是在JavaScript 基础上增加了很多易读的语法糖的新一代编程语言。

CoffeeScript 编译成 JavaScript 在客户端执行，或者在 NodeJS 服务器端执行。它的语法本质就是 JavaScript ，但是提高了代码的可读性。

在 JavaScript 基础上增加了很多 Ruby Python 的语法特性。比如，用缩进代替括号，取消了作为行结束的分号，简化function定义, 用 @ 符号替代OO编程中到处用到的 this 。

增加了很多编程的强制规范，比如默认变量为局部变量，函数最后一行为返回值。

提供了很多 JavaScript 编程经常用到的模式，比如可以给函数提供默认值，改进的循环处理。

由于 CoffeeScript 编译为 JavaScript ，所以可以在任何需要 JavaScript 的地方用 CoffeeScript 取代它。如果说 Web 开发的趋势是 HTML5 和服务器端 JavaScript 。那么 Web 开发的趋势就是 CoffeeScript 。你可以只写一种优雅的现代语言 CoffeeScript 。

CoffeeScript 编写和开发环境

以 Ubuntu 为例

需要安装 NodeJS 作为编译器环境

安装 npm 包管理器

安装 coffee-script 编译器

npm install -g coffee-script

安装 VIM 插件 vim-coffee-script

然后在 VIM 中执行

:CoffeeCompile watch vert

这样在右边窗口开发 CoffeeScript ，可以在左边窗口实时查看被编译成的 JavaScript

也可以用命令行 coffee -c test.coffee 来手动编译

常用的 CoffeeScript 语法例子

定义一个连续数组

numbers = [0..3]

循环操作数列

sites = ['blog.eood.cn','www.eood.cn','google.com']
for site in sites
alert site

甚至可以这样

sites = ['blog.eood.cn','www.eood.cn','google.com']
alert site for site in sites

定义函数

myfunc = (arg) ->
alert arg

或者

myfunc: ->
alert ‘ok’

定义复杂对象

kids =
  brother:
    name: "Max"
    age:  11
  sister:
    name: "Ida"
    age:  9

同过 JQuery 操作 DOM

$('.account').attr class: 'active‘

定义类和类的继承

class Animal
  constructor: (@name) ->

  move: (meters) ->
    alert @name + " moved #{meters}m."

class Snake extends Animal
  move: ->
    alert "Slithering..."
    super 5

class Horse extends Animal
  move: ->
    alert "Galloping..."
    super 45

绑定事件函数到 DOM 对象

  $('.shopping_cart').bind 'click', (event) =>
    @customer.purchase @cart

CoffeeScript 实际生产环境的使用

可以结合 JQuery, Backbone JS 或者所有的 JavaScript 开发框架来开发复杂的前端应用和服务器端应用。37signals 利用了 CoffeeScript + BackboneJS 开发了 HTML5 的手机客户端程序。用 CoffeeScript 来书写 JavaScript 可以减少代码量，不降低代码执行效率，降低开发成本。

Google Reader