Traceur: 体验下一代Javascript语言

by yuanyi

at 2011-05-07 01:26:09

original http://heikezhi.com/2011/05/06/traceur-compiler-next-to-javascript-of-today/

Traceur项目旨在让你预先体验还处于草案阶段的下一代Javascript语言新特性，并根据实际运行的代码来提供反馈，帮助标准制定。

要体验Traceur非常简单，只需要在你的HTML文件头部包含两个js文件即可：

<html>
  <head>
    ...
    <script src="http://traceur-compiler.googlecode.com/svn/branches/v0.10/src/traceur.js"        type="text/javascript"></script>
    <script src="http://traceur-compiler.googlecode.com/svn/branches/v0.10/src/bootstrap.js"        type="text/javascript"></script>
  </head>
</html>

traceur.js是编译器，bootstrap.js则负责将所有script标签中的脚本编译为当前浏览器可执行的Javascript，如果不想这么麻烦，你也可以直接通过这个在线模拟器来体验。

目前Traceur支持以下新的语言特性，每个都十分令人期待：

类继承
Traits，traits特性让你可以将一组方法打包起来，然后混入一个或多个类中，类似Ruby语言中的mixin功能
Modules，Modules主要用来解决模块依赖和部署问题，让你可以有选择的从外部模块导入指定的部分。
迭代器(Iterators)

for (let element : [1, 2, 3]) {
  console.log(element);
}

生成器(Generators)，生成器使用yield语法让创建迭代器变得更简单，而无需再去实现__iterator__
延时函数(Deferred Functions)，延时函数让你可以不用通过回调函数来执行异步的非阻塞代码，而是使用await函数来刮起当前函数的执行并返回一个包含当前函数执行状态的对象：

function deferredAnimate(element) {
    for (var i = 0; i < 100; ++i) {
        element.style.left = i;
        await deferredTimeout(20);
    }
};
deferredAnimate(document.getElementById('box'));

块范围绑定(Block Scoped Bindings)

{
  const tmp = a;
  a = b;
  b = tmp;
}
alert(tmp); // error: 'tmp' is not defined.

自动解包赋值(Destructuring Assignment)

var [a, [b], c, d] = ['hello', [', ', 'junk'], ['world']];
alert(a + b + c); // hello, world

函数默认参数(Default Parameters)

function slice(list, indexA = 0, indexB = list.length) {
  // ...
}

剩余参数（Rest Parameters）

function push(array, ...items) {
  items.forEach(function(item) {
    array.push(item);
  });
}

展开操作符(Spread Operator)，作为其余参数的辅助，展开操作符负责将剩余参数进行展开：

function push(array, ...items) {
  array.push(...items);
}
function add(x, y) {
  return x + y;
}
var numbers = [4, 38];
add(...numbers);  // 42

更多关于新特性及实现细节的介绍请看这里。

想和我们一道传播黑客精神？快来加入吧！

无觅猜您也喜欢：
Handlebars.js入门介绍	超简单的MapReduce Javascript实现	你不懂Javascript	Javascript版Heroku: Akshell
无觅

Google Reader

Traceur: 体验下一代Javascript语言

Traceur: 体验下一代Javascript语言

by yuanyi

at 2011-05-07 01:26:09

original http://heikezhi.com/2011/05/06/traceur-compiler-next-to-javascript-of-today/