1.babel
1、简介：让不支持ES6的浏览器支持它，原理就是把ES6语法转码成ES5。
2、使用：babel-cli脚手架（npm可直接下载）；脚本引入（<script type="text/babel" src="./js/babel.js"></script>）。
3、官网：https://babel.docschina.org/
2.let 块级作用域
1、使用：
//看准大括号{}，这就是一个块
let a = 2;
if (a > 1) {
let b=10;
for (let i = a; i <= b; i++) {
let j = i + 10;
}
let c = a + b;
}2、注意：
1.let定义的变量放在语句块的最前边；
2.多变量在同意块中声明，最好用一个let；
3.let声明的变量属于隐式的转换，因为其把{}去除掉了；
4.let在用之前一定要先定义好，不然触动“死区”可就麻烦了；
5.let在for循环中应用很多，因为每次的遍历都会定义一个新的 i 然后去赋值或计算；
3、比较：
1.var声明变量只有函数才能创建新作用域，let会在所有大括号 {} 中建立新的作用域；
2.同一个作用域中，var出的变量名可重复声明，let不可以重复声明；
3.let声明变量之前任何语句不可使用let出来的变量，会报错（死区）；
3.const声明
1、使用
//声明常量a
const a = 2;
console.log( a ); // 2
a = 3; // TypeError!2、注意：
1.const定义的为常量，即不能改变的值（特殊的是数组和对象）；
2.const a;这时候是不会有a=undefined的；
3.常量不是对这个值本身的限制，而是对赋值的那个变量的限制（数组&对象中的元素还是可以更改的）；
4.常量所定义的常量名一般均为大写字母，方便和变量区分；
4.class类声明
1、简介：class写法让对象原型的写法更加清晰、更像面向对象编程的语法，也更加通俗易懂。
2、使用：
class One{ //定义可以new出来的对象类
constructor(){ //构造器，实例对象自己的属性||方法
this.type = 'one'
}
getName(name){ //所有实例对象公用的属性||方法
console.log(this.type + 'name is:' + name)
}
}
let one= new One(); //实例化的one
one.getName('yjs') //one name is:yjs
class Other extends One{ //子类Other继承父类One
constructor(){
super() //得到实例化的this（子类必须要有的）
this.type = 'other'
}
}
let other= new other()
other.getName('丫头') //one name is:丫头3、注意：
1.class定义的类可以使用new初始化实例，其中的constructor为必填的，只要你需要实例对象独有属性|方法；
2.继承机制，实质是先创造父类的实例对象this（所以必须先调用super方法），然后再用子类的构造函数修改this；
5.箭头函数
1、初识：
//原始
function add(a,b){
return (a+b)
}
//箭头
var add=(a,b)=>{a+b};
//调用
add(1,2)2、讲解：
1.箭头函数总是函数表达式（ var fn=(){ } ）；并不存在箭头函数声明（ function fn(){} ）。
2.作为回调函数，箭头函数的公用还是很大的，如：
var a = [1,2,3,4,5];
//a = a.map( function(v){ retrun v*2 } );
a = a.map( v => v * 2 );
console.log( a ); //[2,4,6,8,10]3.箭头函数的设计目的之一：改变this的指向问题，看下边的例子：
/* 实例1 */
var obj={
fn:function(){
var self=this; //this指向的是obj这个对象
btn.addEventListner("click",function(){
self.fn(); //这里的this指向的是触发的DOM元素
})
}
}
//箭头函数
var obj={
fn:function(){
btn.addEventListner("click",function(){
this.fn(); //这里的this指向的是语法环境中调用的obj
})
}
}
/* 实例2：this指向混乱的可能 */
var obj={
fn:()=>{this.fn2()},
fn2:()=>{ ... }
}
obj.fn(); //此时调用的时候，是在全局进行的，所以语法环境中this就是全局：window4.切记一点，箭头函数的this是语法环境中传递的，不是动态环境中时刻变换的；
3、区别
1.箭头函数式匿名函数，不可以作为构造函数（不能new出来）；
2.箭头函数不绑定arguments参数伪数组，可以使用扩展运算符（...）替代；
3.箭头函数不绑定this，而其内部的this是上下文中调用起始对象；
4.箭头函数无法使用apply，call改变this的指向；
5.箭头函数没有原型属性；
6.模板字符串
1、简介：大段字符串的拼接，用“ + ”拼接很麻烦，所以这个模板字符串就诞生了。
2、使用：
var a="aaa";
var b="bbb";
$("#ids").append(""+
"<p>"+a+"</p>"+
"<p>"+b+"</p>"+
);
$("#ids").append(`<p>${a}</p><p>${b}</p>`) //符号 ` 位置在数字1左边7.扩展运算符
/* 展开：...后边是数组的情况 */
//示例1：
function foo(x,y,z) {
console.log( x, y, z );
}
foo( ...[1,2,3] ); // 1 2 3
//示例2：
var a = [2,3,4];
var b = [ 1, ...a, 5 ];
console.log( b ); // [1,2,3,4,5]
/* 收起：...后边不是数组的情况 */
function foo(...args) {
console.log( args ); //这里的args是真正的数组，跟arguments这个伪数组还是不一样的
}
foo( 1, 2, 3, 4, 5); // [1,2,3,4,5]8.默认值
var w = 1;
function foo( x = w + 1, y = x + 1 ) {
console.log( x, y);
}
foo(); //2,39.解构
1、使用：
function arr(){
return [1,2,3]
}
function obj(){
return {x:4,y:5,z:6}
}
var [a,b,c]=arr();
var {x:x,y:y,z:z}=obj(); //简写方式：var {x,y,z}=obj();(key，value名称相同)
console.log(a,b,c); //1,2,3
console.log(x,y,z); //4,5,62、注意：
1.简写方式省略的是x：这部分，即 {} 书写的是被赋值的变量；
2.对于那些不需要整体赋值的情况，可不使用var来声明；
3.不使用var时，对象解构需要放在小括号里，如：({x,y,z}=obj())，因为{}会当成语句块进行执行；
4.对象解构允许重复赋值，如：var {a:a1,a:a2}={a:1};结果是a1=1，a2=1；
5.数组解构赋值和对象解构赋值来说，你不需要把存在的所有值都用来赋值，如：
var [,b] = arr();
var { x, z } = obj();
console.log(b); //2
console.log(x,z) //4,66.解构（现仅限于数组）在平时和扩展运算符一起使用比较多，可简洁我们的代码，如：
var a = [2,3,4];
var [ b, ...c ] = a;
console.log( b, c ); // 2 [3,4]7.解构和默认值一起使用也是我们平时开发较为常见的，如：
var [ a = 3, b = 6, c = 9, d = 12 ] = arr();
var { x = 5, y = 10, z = 15, w = 20 } = obj();
console.log( a, b, c, d ); // 1 2 3 12
console.log( x, y, z, w ); // 4 5 6 208.嵌套解构，如：
var a1 = [ 1, [2, 3, 4], 5 ];
var o1 = { x: { y: { z: 6 } } };
var [ a, [ b, c, d ], e ] = a1;
var { x: { y: { z: w } } } = o1;
console.log( a, b, c, d, e ); // 1 2 3 4 5
console.log( w ); // 610.对象字面量简易写法
//key-value相同的
var z=10;
var obj={z:z}; //原始写法
var obj1={z}; //简易写法
//对象属性值为函数的
var obj={ a:function(){...} }; //原始写法
var obj1={ a(){...} } //简易写法11.import&export导入导出
1、简介：ES6提出了模块的构想，而这就需要引入模块和输出模块，因此import&export就诞生了，并广泛使用。
2、使用：
//导出
export default 'A cat'
export function say(){
return 'Hello!'
}
export const type = 'dog'
//导入
import { say, type } from './content' 3.注意：
1.export命令除了导出变量，还可以导出函数，甚至是类；
2.导入的时候要注意：大括号里面的变量名，必须与被导入模块（content.js）对外接口的名称相同；
3.导入文件多的默认导出, 可以写在大括号外面；
4.更改导入名称，使用 as 进行更改如：import { type as typeValue } from './js/jsFile.js'；
5.导入所有的导出值，可使用 * 进行导入，如：import * from './js/jsFile.js'；
如需了解更多有关ES6的内容请点击这里!!!