CoffeeScript使用体会

Other 2015-05-15 CoffeeScript,JavaScript

如今,越来越多的副语言代替了传统的Web三大语言,分别是jade/hbs对应html,sass/less对应css,TypeScript/CoffeeScript对应JavaScript,当然,实际上能够对号入座的远不止以上列出的,以上列出的应该算是有点普及率的副语言了。在这当中,我认为做的最完美的应该当属Sass了,本文不讨论它,只讨论CoffeeScript。

但凡是挑战传统,跻身于名列并且不死的新东西,应该都有它的优势所在,CoffeeScript也如此,这门语言的目的就是针对JavaScript的臃肿,毕竟JavaScript问世的时候不没有想到会有今天的成绩,然而JavaScript在TOIBE排行到了前所未有的高度,当下JavaScript开发成为WEB领域最急缺的技术人才。CoffeeScript也因JavaScript受关注的同时步入大家的视野。下面聊聊用了CofffeeScript做几个项目后的真实体会,仅仅是体会。

一、简洁,太过于简洁,导致复制粘贴到IDE里格式总会乱

但凡是看过CoffeeScript官网的那几段简短的例子后,谁都想试一试,我也如此,没看过的童鞋可以点击以下链接进入官网

http://coffeescript.org/

要是打不开,再刷新几次还是打不开,那你就越过那道障碍,世界就在你眼下,你懂的

# Assignment:
number   = 42
opposite = true

# Conditions:
number = -42 if opposite

# Functions:
square = (x) -> x * x

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

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

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

# Existence:
alert "I knew it!" if elvis?

# Array comprehensions:
cubes = (math.cube num for num in list)

编译后的例子

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() {
  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;
})();

是不是有点心动?的确是很简洁,简洁的前提是牺牲一堆结束符,if没有花括号,function没有花括号,于是在你复制大段代码的时候需要尤其小心缩进对不对?我用WebStorm,这个号称最牛逼的前端编辑器在复制大段CoffeeScript代码的时候,仍会有缩进不准确的问题的,因为确实这不怪WebStorm,而是确实不好判断

原代码:

a = (num1, num2)->
    num1 + num2

你在后面复制代码

num1 * num2

会有两种结果,要么是

a = (num1, num2)->
    num1 + num2
    num1 * num2

或者是

a = (num1, num2)->
    num1 + num2
num1 * num2

于是IDE要是默认帮你缩进成为了第一种,而不是你想要的,你只好再选中刚才复制进去的代码再退tab,或者是默认不缩进而你想要第二种,于是你再选中复制的code再tab一次

二、生态圈

有时候,要找一些解决代码,大部分网上贴的各种解决代码都是JavaScript格式的,比如你要搜一些插件的例子用法的代码,结果发现人家贴的是JavaScript格式的,于是你只好照着人家写好的例子代码再一步一步改成CoffeeScript格式的,这个非常耗费时间。用CoffeeScript的目的是为了简洁,减少编码时间,结果却适得其反,所有外部来源的代码你都要去转换。截至目前,我还没发现有哪几个是直接贴的CoffeeScript代码。其实你想想也对,如果你去stackoverflow上给人家贴代码,你会把CoffeeScript和TypeScript格式的都贴进去吗?那其它我没列出来的副语言呢?怎么办?

三、以前写的代码不能复用

如果你有大量的JavaScript项目经验,那么你之前所有的JavaScript代码要复用到你的CoffeeScript项目中来,就需要一条条去翻译它,这个过程一点实际意义都没有,还浪费时间,想想都要后怕。

四、IDE支持不好

我用的是WebStorm,这个编辑器再写JavaScript的时候,没得说,绝对是神器,然而你再用它写CoffeeScript的时候,你会发现很多地方不尽人意。所以我认为即使JavaScript在臃肿,但配合这些牛逼的IDE也可以非常方便编码。比如有一个功能我在写CoffeeScript的时候不敢用,那就是自动格式化代码,CoffeeScript是靠缩进定界的,万一IDE傻缺给缩进乱了那你的程序基本被毁了。JavaScript因为有花括号做定界符,所以不用担心代码格式化会导致程序被破坏。

最后

前面我说过,副语言最成功的就是sass/less了,为何它们比CoffeeScript要好呢?因为它们完全兼容原生css语法格式,这个尤其重要,然后你可以在上面加变量/方法等。话说回来,你就知道Jade也会存在类似CoffeeScript的情况,当然,Jade的会比CoffeeScript好很多,因为项目中写html的代码还是非常少的,即使复写也花不了多长时间。准备用CoffeeScript做项目的童鞋,得慎重啊!

 

 

文字链接:《CoffeeScript使用体会

文章地址:http://www.qttc.net/201505463.html

除非标注,琼台博客所有博文均为原创,转载请加文字链接注明来源

乳名?小名?昵称?网名?均可

email,放心,我不会给你乱投广告的

想获得回访就把你的站点URL写上(没有留空)

[NOTICE]木要投放广告
[NOTICE]木要骂人,说不该说的话
[NOTICE]自由言论,但要遵纪守法

Comments 3