[ES6] 01. Intro to ES6 and traceur compiler
---恢复内容开始---
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的更多相关文章
- 石川es6课程---1-2、ES6简介
石川es6课程---1-2.ES6简介 一.总结 一句话总结: 从ECMAScript的历史发展来看,太顺了的时候总会遇到一挫折,比如ecma4 1.ECMAScript 和 JavaScript关系 ...
- React与ES6(四)ES6如何处理React mixins
React与ES6系列: React与ES6(一)开篇介绍 React和ES6(二)ES6的类和ES7的property initializer React与ES6(三)ES6类和方法绑定 React ...
- React与ES6(三)ES6类和方法绑定
React与ES6系列: React与ES6(一)开篇介绍 React和ES6(二)ES6的类和ES7的property initializer React与ES6(三)ES6类和方法绑定 React ...
- React和ES6(二)ES6的类和ES7的property initializer
React与ES6系列: React与ES6(一)开篇介绍 React和ES6(二)ES6的类和ES7的property initializer React与ES6(三)ES6类和方法绑定 React ...
- ES6入门一:ES6简介及Babel转码器
ES6简介 Babel转码器 Nodejs中使用ES6 WebPack中使用ES6及Babel转码插件 一.ES6简介与转码 1.1一个常见的问题,ECMAScript和JavaScript到底是什 ...
- 石川es6课程---18、ES6 复习
石川es6课程---18.ES6 复习 一.总结 一句话总结: 无论在讲课和学习中,复习总结都是很重要 二.ES6 复习 变量 let const 声明方式 能否重复声明 作用域 类型 是否支持变量提 ...
- ES6 第七节 ES6中新增的数组知识(1)
目录 ES6 第七节 ES6中新增的数组知识(1) 第七节 ES6中新增的数组知识(1) JSON数组格式转换 Array.of()方法: find()实例方法: ES6 第七节 ES6中新增的数组知 ...
- [ES6] 02. Traceur compiler and Grunt
Local Install: npm install -g traceur npm install grunt-contrib-watch npm install grunt-traceur-lat ...
- ES6 实战项目构建 ES6+glup+express
ES6推出已经有几个年头了,平时也有学过一些基本语法,无奈实践经验太少.而且前端早已脱离了刀耕火种的时代,一些自动化构建工具像gulp.webpack等也需要熟练掌握.最近刚签了三方,闲暇之余就找了个 ...
随机推荐
- 洛谷P2323 [HNOI2006] 公路修建问题 [二分答案,生成树]
题目传送门 公路修建问题 题目描述 OI island是一个非常漂亮的岛屿,自开发以来,到这儿来旅游的人很多.然而,由于该岛屿刚刚开发不久,所以那里的交通情况还是很糟糕.所以,OIER Associa ...
- apue第17章笔记
unix domain socket 关闭socket并不会删除文件,重复bind会失败.所以在bind之前要unlink该文件. open服务器的实现只是简单地看了一下,大致上就是通过unix do ...
- 大数据开篇 MapReduce初步
最近在学习大数据相关的东西,开这篇专题来记录一下学习过程.今天主要记录一下MapReduce执行流程解析 引子(我们需要解决一个简单的单词计数(WordCount)问题) 1000个单词 嘿嘿,100 ...
- linux下如何配置TCP参数设置详解
设置tcp参数一定要小心谨慎,轻易不要更改线上环境,我贴一下我们线上环境中,sysctl.conf的内容,见文章底部 net.ipv4.tcp_tw_reuse = 1 net.ipv4.tc ...
- sql 和xml
一·常用基本功能 表结果: 1. 1 <row> 2 <ID>1035</ID> 3 <Rate>6.12</Rate> 4 <Dat ...
- FastReport.Net使用:[32]对话框使用2
方法/步骤 1.先浏览下数据,成绩表中有部分科目成绩没有,如果是这种情况,报表是不能打印的. 2.添加一个对话框,将其Visible属性设置为False,默认情况下改对话框是不显示的. 将确定按钮的D ...
- 我的OI生涯番外篇
番外篇 转眼间我学oi已经一年了,可回头想想这一年来的收获也没有什么,大部分时间都荒废掉了. 下半年开学后,学物竞的王洋转来了我们电竞,虽然他之前是我的同班同学但也没怎么交流过. 这下我们又成为了oi ...
- 「WC2010」重建计划(长链剖分/点分治)
「WC2010」重建计划(长链剖分/点分治) 题目描述 有一棵大小为 \(n\) 的树,给定 \(L, R\) ,要求找到一条长度在 \([L, R]\) 的路径,并且路径上边权的平均值最大 \(1 ...
- 【四边形不等式】HDU3506-Monkey Party
[题目大意] 香蕉森林里一群猴子(n<=1000)围成一圈开会,会长给他们互相介绍,每个猴子需要时间a[i].每次只能介绍相邻的两只猴子x和y认识,同时x所有认识的猴子和y所有认识的猴子也就相互 ...
- Android UI设计规范之知识点
界面尺寸 android的尺寸众多,建议使用分辨率为720×1280的尺寸设计.这个尺寸720×1280中显示完美,在1080×1920中看起来也比较清晰;切图后的图片文件大小也适中,应用的内存消耗也 ...