本篇文章是对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. 使用ConcurrentLinkedQueue惨痛的教训

    服务端原本有个定时任务对一个集合ArrayList 中的消息做处理. 因为考虑到处理消息是先进先出原则,所以优化的时候考虑改用ConcurrentLinkedQueue 当时没仔细深入研究过这个集合就 ...

  2. TextView实现图文混合编排

    TextView实现图文混合编排 一.简介 在这里实现图文混合编排使用的是:TextView中预定义的类似Html的标签 二.方法 * 1.设置好html标签的文本 String html=" ...

  3. php:Mcrypt响应慢的原因解决备注

    作者: Laruence 本文地址: http://www.laruence.com/2012/09/24/2810.html 转载请注明出处 上午的时候, 有同事来找我说上周新上线的一个使用mcry ...

  4. GO学习笔记:struct类型

    Go语言中,也和C或者其他语言一样,我们可以声明新的类型,作为其它类型的属性或字段的容器.例如,我们可以创建一个自定义类型person代表一个人的实体.这个实体拥有属性:姓名和年龄.这样的类型我们称之 ...

  5. docker安装脚本

    此docker安装脚本为官方提供的,可以从网上下载,此处直接把脚本内容贴上. #!/bin/sh set -e # This script is meant for quick & easy ...

  6. WPF中关于配置文件的读取

    在WPF中的配置文件的读取也是经常用到的一个操作,虽然很基础,但是也记录一下,以后忘记了可以看一看. 首先就是先新建一个Application Configuration Flie后缀名是.confi ...

  7. Android 性能测试小工具 Emmagee

    Emmagee 是一个性能测试小工具 用来监控指定被测应用在使用过程中占用机器的CPU, 内存,流量资源的性能小工具 Emmagee 介绍 Emmagee是网易杭州研究院QA团队开发的一个简单易上手的 ...

  8. android开发环境:使用Android Studio搭建Android集成开发环境(图文教程)

    开发环境情况: 物理机版本:Win 7旗舰版(64位) Java SDK版本:jdk1.8.0_25(64位) Android SDK版本:Android 7.1(API 25) Android St ...

  9. 【Demo】HTML5获取地理位置

    HTML5获取地理位置简单实例 实例1--获取地理位置的经纬度: <!DOCTYPE html> <html> <head>  <meta charset=& ...

  10. IOS-Alcatraz(插件管理工具)

    一.简单说明 Alcatraz 是一款 Xcode的插件管理工具,可以用来管理XCode的 插件.模版以及颜色配置的工具. 二.如何安装 1.github地址:https://github.com/a ...