前段时间公司的一个项目是用CoffeeScript和backbone写的，于是去学了一下CoffeeScript，在此给大家分享一下

CoffeeScript--简介

我们知道JavaScript是硬绑了C/Java语法，但CoffeeScript却不是，而是改为采用了类似Ruby/Python的语法，所以可以说，采用了这种语法之后，CoffeeScript更加适合函数式+动态语言内核的

有人说CoffeeScript算是JavaScript的补丁版本，我认为这也是没错的，因为在采用了类似Ruby的语法之后，我们能够更加优美地编写JS代码。何谓优美，我认为就是能够以最少代码量去实现传统JavaScript的操作并且是可使用又易懂的（下面会在实例中给大家展示），不仅如此，CoffeeScript还增加了许多语法糖比如class，extends等等（当然在ES6也增加了，只是CoffeeScript是在ES6之前出现的），这个大家可自行查阅。

总的来说，CoffeeScript让JavaScript编写起来更加地方便快捷，有一句话是这么形容CoffeeScript的：CoffeeScript是编写起来能够快得飞起的JavaScript。

CoffeeScript--代码实例

上文提到的CoffeeScript如何优雅编写代码，我们在下面可以示范一下

比如这是我们常见的一段JavaScript代码（取自CoffeeScript文档）

var cubes, list, math, num, number, opposite, race, square,
 __slice = [].slice;

number = 42;//赋值
opposite = true;

if (opposite) {//条件
  number = -42;
}

square = function(x) {//函数
  return x * x;
};

list = [1, 2, 3, 4, 5];//数组

math = {//对象
  root: Math.sqrt,
  square: square,
  cube: function(x) {
    return x * square(x);
  }
};

race = function() {//Splats
  var runners, winner;
  winner = arguments[0], runners = 2 <= arguments.length ? __slice.call(arguments, 1) : [];
  return print(winner, runners);
};

if (typeof elvis !== "undefined" && elvis !== null) {//存在性
  alert("I knew it!");
}

cubes = (function() {//数组推导
  var _i, _len, _results;
  _results = [];
  for (_i = 0, _len = list.length; _i < _len; _i++) {
    num = list[_i];
    _results.push(math.cube(num));
  }
  return _results;
})();

以上就是在JavaScript中我们会经常用到的代码，那么在CoffeeScript中又是怎样的呢，如下：

# 赋值:
number   = 42
opposite = true

# 条件:
number = -42 if opposite

# 函数:
square = (x) -> x * x

# 数组:
list = [1, 2, 3, 4, 5]

# 对象:
math =
  root:   Math.sqrt
  square: square
  cube:   (x) -> x * square x

# Splats:
race = (winner, runners...) ->
  print winner, runners

# 存在性:
alert "I knew it!" if elvis?

# 数组 推导(comprehensions):
cubes = (math.cube num for num in list)

有没有一种耳目一新的感觉，CoffeeScript中的变量赋值是不需要用var来定义的，可直接赋值。条件语句可不写小括号和大括号。函数使用'->’代表return（这个和ES6中的箭头函数有点像，但还是区别的，比如ES6的箭头函数是静态上下文，this指针不变，CoffeeScript则不是，保留了JavaScript原本的特点）。对象，数组推导等等和原本的JavaScript来比是不是更加地简洁，而且在编写的时候只要遵守CoffeeScript的规范，你会发现你写JS的速度大大提升。

当然这个实例只是CoffeeScript的一小部分，有兴趣的话可以看看文档http://coffee-script.org/

学习的路还在继续，共勉！

CoffeeScript 的简介与代码实例

CoffeeScript--简介

CoffeeScript--代码实例

猜你喜欢