es6学习笔记(一)
一. es6简介
ECMAScript6.0是JavaScript语言的下一代标准,已经在2015年6月正式发布。又称ECMAScript 2015。根据计划,2017年6月将发布 ES2017。
二. 支持度
各大浏览器的最新版本,对ES6的支持可以查看kangax.github.io/es5-compat-table/es6/。
Node.js是JavaScript语言的服务器运行环境,对es6的支持度比浏览器更高。通过Node,可以体验更多ES6的特性。
Babel转码器可以将ES6代码转化为ES5代码,从而兼容不支持ES6的环境。
// 转码前,使用了ES6新特性,箭头函数 input.map(item => item + 1);
// 转码后,转换为能在现有环境执行的普通函数 input.map(function (item) { return item + 1; });
三. 安装Babel
1. 项目根目录node init
2. 新建.babelrc文件
该文件用来设置转码规则和插件,基本格式如下。
{
"presets": [],
"plugins": []
}
presets字段设定转码规则,官方提供以下的规则集,你需要安装。
# ES2015转码规则 $ npm install --save-dev babel-preset-es2015 # react转码规则 $ npm install --save-dev babel-preset-react # ES7不同阶段语法提案的转码规则(共有4个阶段),选装一个 $ npm install --save-dev babel-preset-stage-0 $ npm install --save-dev babel-preset-stage-1 $ npm install --save-dev babel-preset-stage-2 $ npm install --save-dev babel-preset-stage-3
然后,将这些规则加入.babelrc。
{
"presets": [
"es2015",
"react",
"stage-2"
],
"plugins": []
}
3. Babel提供babel-cli工具,用于命令行转码。
$ npm install --global babel-cli
将babel-cli安装在项目之中。
# 安装 $ npm install --save-dev babel-cli
然后,改写package.json。
{
// ...
"devDependencies": {
"babel-cli": "^6.0.0"
},
"scripts": {
"build": "babel src -d lib"
},
}
转码的时候,就执行下面的命令。
$ npm run build
4. babel-node命令,提供一个支持ES6的REPL环境。它支持Node的REPL环境的所有功能,而且可以直接运行ES6代码。
$ babel-node > (x => x * 2)(1) 2

浙公网安备 33010602011771号