Posted by:
努力记

努力记,通过记录,计划,让自己的努力可以触碰彩虹!

1,327

Node.js:CoffeeScript学习

  • 2013-12-16
  • 暂无评论

CoffeeScript 解决了 JavaScript 痛点。

CoffeeScript:

  • 提供一种比较简单的语法,减少了样板代码,诸如括号和逗号
  • 使用空格作为一种组织代码块的方法
  • 提供拥有表达函数的简单语法
  • 提供基于类的继承(可选项,但是在进行应用程序开发时非常有用)

您可能会想,相较于 JavaScript,CoffeeScript 肯定有一些劣势,因为它的语法比较抽象。
1.例如,CoffeeScript 会不会比 JavaScript 更慢?会不会需要一个较大的运行时库?
实际上,CoffeeScript 将编译成简洁、高效的 JavaScript,您总能清楚地看到正在编译的内容,因此,您可以很自信没有引入过多的东西。
2.此外,因为 CoffeeScript 将完全编译成函数式 JavaScript,所以不需要任何类型的运行时库。
CoffeeScript 所提供的语法允许您充分利用 JavaScript 的强大功能,而只需要较小的运行时开销。

若要安装 CoffeeScript,需要先安装 Node.js,因为:

  • CoffeeScript 使用节点的包管理程序 NPM,作为 Node.js 的一个包进行分布。
  • CoffeScript 必须被编译,其编译器实际上就是使用 CoffeeScript 编写的,所以,需要一个 JavaScript 运行时来完成其编译。作为 Node.js 核心的 V8 JavaScript 虚拟机很适合这一任务。

开始安装:

1.通过npm安装coffeescript

npm install --global coffee-script。

--global 标记使 CoffeeScript 可广泛用于系统,而不仅仅用于特定项目。
NPM 在 /usr/bin 中创建了一个快捷键,因此,现在可执行 Coffee 位于正确的路径中,这就是 CoffeeScript 编译器和解释器。
若要验证可执行 coffee 是否位于路径中,在命令行运行

coffee -v

每个Node.js模块都同样操作:

  1. 为了使模块可用于任何已启动的 Node.js 进程,您需要将其添加到 Node.js 的 NODE_PATH 中。
  2. 在遇到不能识别的函数时,Node.js 将搜索 NODE_PATH 获取模块(库)。
  3. 可以将 Node.js 作为可执行 CoffeeScript 运行时来使用。最简单的方法是仅将所有 NPM 模块添加到 NODE_PATH。

要找出 NPM 模块的位置,输入

 npm ls -g

需要添加一个环境变量将 NODE_PATH 指向其位置。例如,如果 npm ls -g 输出 /usr/lib,那么模块则位于 /usr/lib/node_modules。要设置一个 NODE_PATH 环境变量,运行

export NODE_PATH=/usr/lib/node_modules。

可以通过将上述命令放入启动脚本(比如说 ~/.bash_profile)中来流水线化这些操作。若
要验证更改,通过执行 Node 启动一个 Node.js shell,然后输入 require('coffee-script')。Node.js shell 会加载 CoffeeScript 库。

2.运行

$ coffee cup0.coffee

输入 coffee -c 即可编译成js文件
自动编译

coffee -w --output lib --compile src

这里假设你的coffee代码在src目录下,这个daemon会自动检测文件的改变,并编译成js文件放到lib目录下
其他参数详解:http://coffeescript.org/

3.REPL

REPL 是一个在许多编程语言中,特别是在各种函数式语言中都能找到的标准工具。
REPL 就相当于 Ruby 的 IRB,只需输入 coffee就会启动 CoffeeScript 的 REPL。(命令行工具)

4.动态编译(影响性能)

例子:

<html>
<head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">
</script>
    <script
 src="http://jashkenas.github.com/coffee-script/extras/coffee-script.js">
 </script>
    <script type="text/coffeescript">
        gcd = (a,b) -> if (b==0) then a else gcd(b, a % b)
        $("#button").click -> 
            a = $("#a").val() 
            b = $("#b").val() 
            $("#c").html gcd(a,b)
    </script>
</head>
<body>
    A: <input type="text" id="a"/><br/>
    B: <input type="text" id="b"/><br/>
    <input type="button" value="Calculate GCD" id="button"/> <br/>
    C: <span id="c"/>
</body>
</html>
  1. 该网页使用了 Google 的 Ajax 库来加载 jQuery,从 CoffeeScript 的创建者 Jeremy Ashkenas 的 Github 资源库(参见 参考资料)载入 CoffeeScript 编译器库。
  2. 该代码包含了一个脚本块,不过它的类型并非 text/javascript,而是 text/coffeescript,这就是 CoffeeScript 编译器如何知道要编译的脚本内容。
  3. 该脚本接着创建了一个名为 gcd 的函数,该函数计算两个整数的最大公约数。
  4. jQuery 被用来为页面上的按钮创建单击处理程序,您可以从处理程序中获取两个文本输入域的值,并把它们传递给函数 gcd,计算所得的结果被写回到网页中。
  5. $()、val() 和 html() 等均是 jQuery 函数,但可以轻易地和 CoffeeScript 结合使用,并利用 CoffeeScript 简洁语法的优势。

5.与JS框架整合:

上面的例子很好的结合了jQuery,让代码更简洁



back up ↑

无觅相关文章插件,快速提升流量