es6如何入门
最近在学习javascript es6，也在看javascript es6标准入门，所以结合了这本书的内容写了一个读书笔记，希望对入门学习ES6的同学有点帮助。
运行环境
node环境的检查
查看node对es6的支持状况
$ node --v8-option | grep harmory
阮一峰自写插件 @github
$ npm install -g es-checker
$ es-checker
babel转码器
babel安装
$ npm install --glabel bael-cli
$ npm install --save babel-preset-2015
在当前目录新建.babelrc文件
// .babelrc
{
preset:[2015]
}
babel功能
babel-node 可直接运行es6代码
$ babel-node
> cosnole.log([1,2,3].map(x=>x*x))
[1,4,9]
babel-node 可直接运行脚本
// es6.js
cosnole.log([1,2,3].map(x=>x*x))
[1,4,9]
$ babel-node es6.js
babel命令可以将es6文件转为es5文件此处不是babel-node
$ babel es6.js
"user strict"
console.log([1,2,3].map(function(x){
return x*x
}))
输出参数
-o 输出至某文件
$ baebl es6.js -o es5.js
-d 转换整个目录
$ baebl -d es6 es5
-s 输出source-map
$ baebl -d es6 es5 -s
浏览器环境
babel6开始不再提供浏览器版本，而使用构建工具构建
可以使用以下方法安装5.x版本
$ node install label-core@5
并于页面中使用
<script src="node_module/babel-core/browser.js"></script>
<script type="text/babel">
//enter your code
</script>
此种做法会对浏览器性能产生影响，在script标签中需要注明 text/babel
配合Browserify可以生成浏览器能够直接加载的脚本
首先安装babelify
$ npm isntall --save-dev babelify babel-preset-2015
然后用命令行转至es6脚本
$ browsweify script.js -o bundle.js \\ -t [ babelify --presets[ es2005 react]
上面代码将script.js 转为bundle.js,浏览器可直接加载bundle.js
建立package.json，可不必输入参数
{
"browserify":{
"transform":[["babelify",{"presets":["es2015"]}]]
}}
node.js环境
如果需要在node中将es6转为es5，需要安装如下：
$ npm install --save babel-core babel-preset-2015
在当前目录新建.babelrc文件
// .babelrc
{
preset:[2015]
}
在脚本文件的最后调用babel-core的transform方法
var es5Code='let x=n=>n+1';var es6Code=rquire('babel-core').transform(es5Code,{preset:['es2015']});//"user strict";\\n\\nvar x=function(n){\\n return n+1;\\n}
设置钩子做法，这将会对所有后面引入的js,es6,es,jsx文件进行转码加载
rquire('babel-core/register');
注意:babel默认不会转换Iterator,Generator,Set
,Map,Proxy,Reflext,Symbol,Promise等全局对象以及一些定义在全局对象上的方法，需要安装babel-polyfill模块来进行扩展
$ npm install --save babel-polyfill
然后在所有脚本顶部引入
rquire('babel-polyfill');
原文来自：简书／tinlee