ES6前端技术
第一章：ES6入门简介
回顾：
- JavaScript
本章内容：
- JavaScript和ECMAScript的关系
- ES的版本历史
- 浏览器兼容性
- 开发工具
为什么要学习ES6
1.ES6是ES版本系列里面变化内容最多，具有里程碑意义
2.ES6加入很多新的语法特性，使编程更加简单、高效
3.ES6是目前前端公司比较流行的开发技术，比如说微信开发、支付宝小程序、前端页面等等
4.ES6是前端发展趋势，就业必备技能、面试必问
第一节 名词介绍
1.JS和ES的关系
JS:是javascript的简称，是网景公司开发的语言，当时为了凑java的热度，改名叫javascript，为了让js走出美国、走向世界，把该语言托付给了欧洲豪门（ECMA）。
JS：BOM、DOM、ECMAScript
ECMAScript:随了ECMA的姓--》ECMAScript
什么意思：ECMA是豪门，子女众多，老爷子随便给ECMAScript编号，叫262.
2.ECMA
ECMA（European Computer Manufacturers Association）中文名称为欧洲计算机制造商协会，这个组织的目标是评估、开发和认可电信和计算机标准。1994 年后该组织改名为 Ecma 国际。
Ecma 国际制定了许多标准 http://www.ecma-international.org/publications/standards/Standard.htm
ECMA-262（ECMAScript）历史版本查看网址 http://www.ecma-international.org/publications/standards/Ecma-262-arch.htm
3.ECMASCript历史
简称ES
ES1 1997
ES2 1998
....
ES4 2008，当时版本过于超前，被废弃了
ES5 2009年 ，到现在还在使用
ES6 2015年 ，因为面向对象开发已经风靡全球，互联网发展如火如荼，js为了适应发展，增加了很多新的特性，let const，解构赋值、扩展运算符、箭头函数、promise编程。
ES7 2016年
ES8 2017
...
ES.Next 动态下一个版本
4.TC-39
ES是一门语言的标准，需要一帮大佬来维护，ECMA已看262，发展良好，给他弄个奶爸团，名字叫TC-39.
主要是大厂派来的高手，是浏览器大厂代表，比如说有谷歌、苹果、微软，TC-39定期召开会议，提出新标准。
5个阶段
Stage0 展示阶段， 提建议
Stage1 征求意见 问委员会，行不行
Stage2 草案阶段 统一，弄个草案
Stage3 候选阶段
Stage4 定案阶段
第二节：IDE和浏览器兼容性问题解决
常言道：“工欲善其事必先利其器”，“磨刀不误砍柴工”，我们在编写ES6程序的时候，使用什么IDE（开发工具）
1.IDE开发工具
WebStorm
WebStorm 是jetbrains公司旗下一款JavaScript 开发工具。已经被广大中国JS开发者誉为“Web前端开发神器”、“最强大的HTML5编辑器”、“最智能的JavaScript IDE”等。
2.浏览器兼容性问题解决
http://kangax.github.io/compat-table/es6/
IE10+、Chrome、FireFox、移动端、NodeJS都支持
给用户看的，有的用户还使用旧的浏览器，但是程序员追求新技术，用户，打不开，有bug，发牢骚。
2.1 在线转换
使用一个转换文件js,在打开ES6程序时候，提前调用转换文件，当然这种情况，就会浪费资源
需要一个文件babel.min.js
<script src="babel-browser.min.js"></script>
<script type="text/babel">
let name="张三";
console.log(name);
//
var fn=(v=>console.log(v));
fn('this is a dog');
</script>
2.2提前编译
编译概念：需要编译器，这里需要Babel编译器，是js的编译器，可以把最新的ES代码编译成当前项目可执行的代码，简而言之，可以让我们在当前的项目中使用最新的ES版本（6 7 8 9 10),为了更好的使用ES系列新版本，必须掌握Babel。
2.2.1 安装Node.js
soft目录，或者关注AAA企业微信公众号，索取一下即可。
2.2.2 更改镜像
npm工具，外国，我们使用阿里
npm config set registry https://registry.npm.taobao.org/
npm config get registry
2.2.3安装babel-cli
npm install babel-cli -g
或npm install babel-cli -g
完毕之后，看babel的版本号
babel -V
2.2.4 初始化项目
npm init
完毕之后，会多出来一个package.json文件
2.2.5 创建babel的配置文件
echo.>.babelrc
配置一下这个文件
{
//设置转码规则
"presets": ["es2015","stage-2"],
"plugins": ["transform-runtime"] //设置插件
}
2.2.6 安装要转换的插件
npm install babel-core babel-preset-es2015 babel-plugin-transform-runtime babel-preset-stage-2 -save-dev
2.2.7 修改package.json
"build": "babel src -w -d lib"
表示要转换（编译）的源文件和目标文件，需要目录来管理，src:源文件;lib:目标文件
2.2.8 创建index.js
var fn=(v=>console.log(v));
fn('this is arrow by zhang');
babel-node index.js可以执行js
显示：
2.2.9转换一下
npm run build
lib目录下的index.js转换文件为：
'use strict';
var fn = function fn(v) {
return console.log(v);
};
fn('this is arrow by zhang');
扩展：
Babel 是巴比伦文化里的通天塔，用来给 6to5 这个项目命名真得太贴切了！羡慕这些牛逼的人，不光代码写得好，还这么有文化，不像我们，起个变量名都得憋上半天，吃了没有文化的亏。
