---恢复内容开始---

ES6 is ECMAScript version 6, which JavaScript is based on. The next version of JavaScript is going to be based on version 6 of ECMAScript.

Tracer is a way to compile that next version of JavaScript back into JavaScript of today, meaning that you can write the next version of JavaScript and have it compiled down to JavaScript you can use today, because ES6 isn't supported completely and not standardized completely across all the browsers, in Note and everything.

While ES6 is still being standardized and all the browsers are still working on supporting all the different features, it's worth getting a head start because Angular 2.0 will be based on ECMAScript 6 in the future when it's released. Thanks to Tracer, we can start playing around with ES6 features today as well as some of the things that Angular has started releasing, like DI, that already use ES6.

In the future, we'll also get to the ECMAScript 6+ that AngularJS 2.0 will work with, which adds things like annotations and some sort of typing. It's kind of what like TypeScriptdoes by compiling the static-type JavaScript down to JavaScript.

After you install Tracer using npm install Tracer using the -g global flag or not. Here I did and I just used Tracer to output this file, which is an ES6 file, to this Tracer-compiled file. Again, this is the JavaScript of today, the one that's being output, and this is ES6.

npm install tracer -g

Now, the file that this outputs is the file you'll want to use with the Tracer runtime, so you'll include the Tracer runtime first and then include the output file. Then the browser will be able to use this file just fine. Again, you're not using the ES6 file. You're using the output Tracer-compiled file. Then loading the Tracer runtime and then loading your own compiled file.

If instead of using the browser, you want to invoke that file with node, simply use Tracer, and instead of using it to compile you can use it to run the output file and then run through the Tracer-compiled file using Tracer as the "runtime."

While installing Tracer is as easy as npm install Tracer, if you want to jump right in, you can just open ES6 Fiddle in your browser and load one of the examples. Then hit run and you can begin playing with ES6 right away.

Basically behind the scenes, this is compiling this to a Tracer-compiled file and then running it through Tracer to give you what the output of the console is.

[ES6] 01. Intro to ES6 and traceur compiler的更多相关文章

  1. 石川es6课程---1-2、ES6简介

    石川es6课程---1-2.ES6简介 一.总结 一句话总结: 从ECMAScript的历史发展来看,太顺了的时候总会遇到一挫折,比如ecma4 1.ECMAScript 和 JavaScript关系 ...

  2. React与ES6(四)ES6如何处理React mixins

    React与ES6系列: React与ES6(一)开篇介绍 React和ES6(二)ES6的类和ES7的property initializer React与ES6(三)ES6类和方法绑定 React ...

  3. React与ES6(三)ES6类和方法绑定

    React与ES6系列: React与ES6(一)开篇介绍 React和ES6(二)ES6的类和ES7的property initializer React与ES6(三)ES6类和方法绑定 React ...

  4. React和ES6(二)ES6的类和ES7的property initializer

    React与ES6系列: React与ES6(一)开篇介绍 React和ES6(二)ES6的类和ES7的property initializer React与ES6(三)ES6类和方法绑定 React ...

  5. ES6入门一:ES6简介及Babel转码器

    ES6简介 Babel转码器 Nodejs中使用ES6 WebPack中使用ES6及Babel转码插件 一.ES6简介与转码  1.1一个常见的问题,ECMAScript和JavaScript到底是什 ...

  6. 石川es6课程---18、ES6 复习

    石川es6课程---18.ES6 复习 一.总结 一句话总结: 无论在讲课和学习中,复习总结都是很重要 二.ES6 复习 变量 let const 声明方式 能否重复声明 作用域 类型 是否支持变量提 ...

  7. ES6 第七节 ES6中新增的数组知识(1)

    目录 ES6 第七节 ES6中新增的数组知识(1) 第七节 ES6中新增的数组知识(1) JSON数组格式转换 Array.of()方法: find()实例方法: ES6 第七节 ES6中新增的数组知 ...

  8. [ES6] 02. Traceur compiler and Grunt

    Local Install:  npm install -g traceur npm install grunt-contrib-watch npm install grunt-traceur-lat ...

  9. ES6 实战项目构建 ES6+glup+express

    ES6推出已经有几个年头了,平时也有学过一些基本语法,无奈实践经验太少.而且前端早已脱离了刀耕火种的时代,一些自动化构建工具像gulp.webpack等也需要熟练掌握.最近刚签了三方,闲暇之余就找了个 ...

随机推荐

  1. 第10天-JavaScript正则表达式

    正则有什么用 给定的字符串是否符合正则表达式的过滤逻辑 通过正则表达式,从字符串中获取我们想要的特定部分 替换字符串满足正则表达式的字符 例如:验证邮箱.手机号.银行卡.采集器(爬虫).中奖信息133 ...

  2. linux——(8)数据流重定向、管道命令

    概念一:数据流重定向 数据流分输入流和输出流,还有一个标准错误流,负责管理出错信息,比如一般的命令的输出会输出到屏幕上,我们可以用重定向让他输入到某个文件内. 相关操作: 1,标准输入(stdin): ...

  3. javascript函数笔记

    函数是一个具有特定功能的语句块.函数的定义使用关键字 function,语法如下: function funcName ([parameters]){ statements; [return表达式;] ...

  4. 关于urllib、urllib2爬虫伪装的总结

    站在网站管理的角度,如果在同一时间段,大家全部利用爬虫程序对自己的网站进行爬取操作,那么这网站服务器能不能承受这种负荷?肯定不能啊,如果严重超负荷则会时服务器宕机(死机)的,对于一些商业型的网站,宕机 ...

  5. python __str__ , __repr__区别

    Python 有办法将任意值转为字符串:将它传入repr() 或str() 函数. 函数str() 用于将值转化为适于人阅读的形式,而repr() 转化为供解释器读取的形式 (如果没有等价的语法,则会 ...

  6. 【BZOJ 1398】 1398: Vijos1382寻找主人 Necklace (最小表示法)

    1398: Vijos1382寻找主人 Necklace Time Limit: 5 Sec  Memory Limit: 128 MBSubmit: 308  Solved: 129 Descrip ...

  7. [ZOJ3254] MON 9.2009Secret Code

    A^x = D (mod P) 0 <= x <= M, here M is a given integer. 1 <= A, P < 2^31, 0 <= D < ...

  8. 「CSA72」MST

    「CSA72」MST 题目大意:有一个大小为 \(n\) 的无向完全图,\(x, y\) 之间的边权值为 \(a[\min(x,y)][\max(x,y)]\) ,初始为0,进行 \(m\) 次修改, ...

  9. [BZOJ5028]小Z的加油店

    [BZOJ5028]小Z的加油店 题目大意: 一个长度为\(n(n\le10^5)\)的数列,\(m(m\le10^5)\)次操作,支持区间加和区间\(\gcd\). 思路: 线段树维护差分,\(\g ...

  10. bzoj 2763: [JLOI2011]飞行路线 -- 分层图最短路

    2763: [JLOI2011]飞行路线 Time Limit: 10 Sec  Memory Limit: 128 MB Description Alice和Bob现在要乘飞机旅行,他们选择了一家相 ...