本篇文章是对CoffeeScript做一个初步的了解、入门的学习笔记。

什么是CoffeeScript

一种新编程语言,是一套JavaScript的转译语言,可编译成高效的JavaScript。还可以与Node.js技术相结合,构建高效的服务器端应用程序。受到Ruby、Python等语言的启发,CoffeeScript增强了JavaScript的简洁性和可读性。

CoffeeScript解决了JavaScript的一些问题:

  • 简单的语法,减少样板代码,例如括号和逗号
  • 使用空格作为组织代码块的方法
  • 提供表达函数的简单语法
  • 提供基于类的继承

示例代码

CoffeeScript

alert "Hello CoffeeScript!"
x = (a) -> a*2 for i in [0..5]
console.log "Hello #{i}"

等价于如下的代码:

JavaScript

var x;

alert("Hello CoffeeScript!");

x = function(a) {
return a * 2;
}; (function() {
var i;
for (i = 0; i <= 5; i++) {
console.log("Hello " + i);
}
}).call(this);

可以看出,某些语法和Ruby完全一致,但相比JavaScript,要简洁了很多。

Web页面中的CoffeeScript

首先在head区域加上CoffeeScript的编译器:

<script type="text/javascript" src="http://jashkenas.github.com/coffee-script/extras/coffee-script.js"></script>

然后就可以在html文件里编写CoffeeScript代码了:

<script type="text/coffeescript">
x = (a) -> a*2
alert x(3)
</script>

自己动手测试一下吧。

Reference

http://coffeescript.org/

http://baike.baidu.com/view/4809539.htm

http://zh.wikipedia.org/wiki/CoffeeScript

http://blog.jobbole.com/29190/

About CoffeeScript的更多相关文章

  1. emmet,jade,haml, slim,less,sass,coffeescript等的实战优缺点

    摘要: 文章背景,来自于群内周五晚上的一次头脑风暴式的思维碰撞交流活动. 随着前端技术的蓬勃发展, 各种新技术随着生产力的需要不断的涌入我们的视野, 那今天探讨的话题是这些新时代的前端兵器谱: 一. ...

  2. CSS3与页面布局学习总结(七)——前端预处理技术(Less、Sass、CoffeeScript、TypeScript)

    CSS不像其它高级语言一样支持算术运算.变量.流程控制与面向对象特性,所以CSS样式较多时会引起一些问题,如修改复杂,冗余,某些别的语言很简单的功能实现不了等.而javascript则是一种半面向对象 ...

  3. Coffeescript实现canvas时钟

    前言 参照Mozilla 官方教程,要在Canvas上画动画时钟,思路非常有意思. 把动画看作是多个帧组成,定时每个时间点在Canvas上画一帧来实现动画.而Mozilla 官方教程画图实现的思路有意 ...

  4. CoffeeScript实现Python装潢器

    在上篇Angular遇上CoffeeScript – NgComponent封装中,我们讲述了CoffeeScript这门小巧的语言,摒弃JavaScript中糟粕(“坑”)部分,并将JavaScri ...

  5. Angular遇上CoffeeScript - NgComponent封装

    CoffeeScript是基于JavaScript的一门扩展小巧语言,它需要编译成JavaScript,然后再运行与浏览器或者Nodejs平台.JavaScript由于商业原因10天时间就匆忙诞生,所 ...

  6. CSS3与页面布局学习笔记(七)——前端预处理技术(Less、Sass、CoffeeScript、TypeScript)

    CSS不像其它高级语言一样支持算术运算.变量.流程控制与面向对象特性,所以CSS样式较多时会引起一些问题,如修改复杂,冗余,某些别的语言很简单的功能实现不了等.而javascript则是一种半面向对象 ...

  7. coffeeScript中类的多态[学习篇]

    类的一大应用就是多态.多态是一个面向对象编程的高级术语----“一个东西可编程很多不同的东西,但不是任何东西”.[引自coffeescript深入浅出] class Shape constructor ...

  8. coffeeScript中类的继承[学习篇]

    只是在看深入浅出coffeescript中感觉真的很好,不光是coffe写法简单,生成的js也值得学习,废话不多说了,直接抄个书上的例子 class Pet constructor: -> @i ...

  9. 《CoffeeScript应用开发》学习:第五章 CoffeeScript中的类

    在CoffeeScript中定义类 在CoffeeScript中,使用class定义类,使用关键字new实例化对象. 给类绑定方法 class Airplane takeOff: -> cons ...

  10. 《CoffeeScript应用开发》学习:第三章-构建简单的应用程序

    字符串插值 CoffeeScript提供了一种更好的构建字符串的解决方案.在双引号字符串(单引号无效)中使用#{}包含一个动态的值. str = 'Hello, CoffeeScript.' cons ...

随机推荐

  1. .net 数据脱敏代码实现

    方案一: DTO中处理: private string idNumber; /// <summary> /// 身份证号码 /// </summary> [Column(&qu ...

  2. IE报错:缺少标识符、字符串或数字

    在调试ExtJS程序时,在firefox和chrome上都能显示,但一到IE上就报错,后来从左下角的JS报错提示中才发现,原来是JS代码中多加了个逗号. menu: { items: [{ text: ...

  3. Pandas面板(Panel)

    面板(Panel)是3D容器的数据.面板数据一词来源于计量经济学,部分源于名称:Pandas - pan(el)-da(ta)-s. 3轴(axis)这个名称旨在给出描述涉及面板数据的操作的一些语义. ...

  4. Java多线程 - Callable和Future

    已知的创建多线程的方法有继承Tread类和实现Runnable方法.此外Java还提供了Callable接口,Callable接口也提供了一个call()方法来做为线程执行体.但是call()方法与r ...

  5. scala LocalDateTime String 转换

    DateTimeFormatter df = DateTimeFormatter.ofPattern("yyyy-MM-dd HH:mm:ss");LocalDateTime ti ...

  6. 全国城市部分js

    var areaJson22 = { "id": "0", "name": "全国", "parentId&q ...

  7. shell awk命令

    语法: awk '{command}' filename  多个命令以分号分隔. awk 'BEGIN {command1} {command2} END{command3}'  注意:BEGIN , ...

  8. idea maven打包 install 报错The packaging for this project did not assign a file to the build artifact

    如题,这其实是个低级错误,这个错的意思是,找不到这个插件的包. 原因很简单,不是找不到这个打包插件,而是自己的项目没有从maven仓库里加载这个包到项目里,因此会找不到. 看一下问什么会报这个错: 大 ...

  9. python面向对象编程 继承 组合 接口和抽象类

    1.类是用来描述某一类的事物,类的对象就是这一类事物中的一个个体.是事物就要有属性,属性分为 1:数据属性:就是变量 2:函数属性:就是函数,在面向对象里通常称为方法 注意:类和对象均用点来访问自己的 ...

  10. LeetCode OJ:Plus One (加1)

    Given a non-negative number represented as an array of digits, plus one to the number. The digits ar ...