今天开始学coffeeScript(一)

大约是在两年前，我曾经接触过CoffeeScript(以下简称coffee)，并且跟着书本简单地写过几行代码，但是当时我要是个刚开始接触前端开发的实习生，对于JavaScript几乎还是一窍不通的状态，就没有深入去学习Coffee。所以一直到今天，一个偶然的机会让我跟它再次相遇，于是我决定认真地对待它。

Coffee其实并不是任何一个JavaScript的库或者框架，而是一种JavaScript转译语言，在代码运行前，会被编译成高质量的JavaScript，所以实际上真正运行的程序依然是JavaScript，但它简化了编写JavaScript的过程并大大地缩短了JavaScript的代码量，使我们的前端开发人员不必再铺张繁琐地进行JavaScript脚本的编写，是一门伟大而优雅的转译语言。

闲话少絮，我们还是进入正题，开始学习CoffeeScript吧！

首先，在使用之前，我们必须知道使用Coffee所必须的环境，因为网上有很多安装的教程，我就不介绍了，这里贴几个链接供参考：

Windows环境下：http://freewind.me/blog/20111020/450.html

Linux 或者mac：http://blog.eddie.com.tw/2011/08/03/install-coffeescript/

如果在安装之前迫不及待地想体验一下Coffee，那么奉上链接：http://coffee-script.org/。

那么接下来，我们开始正式学习Coffee的语法。

变量的定义和作用域：

CoffeeScript 编译器会考虑所有变量, 保证每个变量都在词法域里适当地被定义 — 你永远不需要自己去写var，coffee会自动在变量第一次出现的地方的作用域内为其加上var，当你需要定义一个全局变量时，只需定义为window即可。

CoffeeScript:

#定义变量
outer = 1
#全局变量
window.v=1
#定义数组，可以试用换行符来省略逗号。
array=[1,2,3
4,5,6
7,8,9
]
#定义对象， 对象可以用缩进替代花括号来声明.
kids =
  brother:
    name: "Max"
    age:  11
  sister:
    name: "Ida"
    age:  9
#定义函数，试用符号“->”
changeNumbers = ->
#此处定义的inner的作用域会默认为在函数changeNumbers里面，不会干扰全局的inner
  inner = -1
  outer = 10
inner = changeNumbers()

JavaScript:

var array, changeNumbers, inner, kids, outer;

outer = 1;

window.v=1

array = [1, 2, 3, 4, 5, 6, 7, 8, 9];

kids = {
  brother: {
    name: "Max",
    age: 11
  },
  sister: {
    name: "Ida",
    age: 9
  }
};

changeNumbers = function() {
  var inner;
  inner = -1;
  return outer = 10;
};

函数：

定义函数名与变量名一样，将函数名写在最前面，之后是一个等号，然后是是个可选的圆括号包裹着参数（如果没有参数就可以省略了），接下来是一个箭头“->”，最后是函数体。

CoffeScript:

square = (x) -> x * x
cube   = (x) -> square(x) * x
triangle = (x,h) -> x * h /2

JavaScript:

var cube, square,triangle;

square = function(x) {
  return x * x;
};

cube = function(x) {
  return square(x) * x;
};
triangle = function(x.h){
  return x * h / 2;
};

使用条件语句（if else unless）：

在coffee中不需要使用圆括号和花括号，可以使用缩进来代替，或者在使用条件语句时，可以在语句的后面加上if 或者unless来作为后缀。另外，在coffee中可以使用 and 来代替&&，使用or来代替 || ，这让coffee代码看起来就像是在说话。

CoffeeScript:

#使用缩进
if a and b
   a=b
else
 a=1
 b=1
#使用后缀
a=b if a and b
#使用后缀，这个看起来像不像在说话？
a=if a b then b else 1

JavaScript:

var a, b;

if (a && b) {
  a = b;
} else {
  a = 1;
  b = 1;
}

if (a && b) {
  a = b;
}

a = a(b) ? b : 1;

好哒，第一节的内容到此为止，欲知后事如何，请听下回分解~