ES6（持续更新中...）

ES6 是 ECMAScript 标准十余年来变动最大的一个版本,主要是为了解决 ES5 的先天不足,主要添加了 类、模块、promise 等,是前端基础 ，请看ES6表格

功能	方法	细节
声明与表达式	let与const
声明与表达式	解构赋值
声明与表达式	symbol
内置对象(新增)	map与set
内置对象(新增)	proxy与reflect
内置对象(扩展)	字符串	扩展的方法、模板字符串
内置对象(扩展)	数值
内置对象(扩展)	对象
内置对象(扩展)	数组	创建 扩展 缓冲
运算符与语句	函数	箭头函数
运算符与语句	迭代器	for…of
运算符与语句	class类	用法 decorator 封装继承
运算符与语句	模块	export 与import 基本用法
异步编程	promise对象	状态 用法
异步编程	Generator函数	用法 场景
异步编程	async函数	语法 场景 async await

ES6 let与const 关键字及变量的区别

js声明变量有三个关键字，分别是 var let const
作用域
var 属于函数作用域（局部作用域）或者全局作用域，存在变量提升，
let const 属于块级作用域，只能在{}内访问，不存在变量提升
变量定义
var 声明变量未赋值不会报错,允许修改值，
let 声明变量未赋值不会报错,允许修改值，
const 声明变量未赋值会报错,不允许修改值，
区别

名称	作用域	变量提升	声明	赋值
var	函数/全局	存在	可以重复声明，在块中重新声明变量也会重新声明块外的变量	声明变量未赋值不会报错,允许修改值
let	块级	不存在	可以重复声明，在块中重新声明变量不会影响块外的变量	声明变量未赋值不会报错,允许修改值
const	块级	不存在	同一块内不允许重复声明，在块中重新声明变量不会影响块外的变量	声明时必须进行初始化，声明变量未赋值会报错,不允许修改值

总结：
使用var关键字声明的全局作用域变量属于window对象。
使用let关键字声明的全局作用域变量不属于window对象。
使用var关键字声明的变量在任何地方都可以修改。
在相同的作用域或块级作用域中，不能使用let关键字来重置var关键字声明的变量。
在相同的作用域或块级作用域中，不能使用let关键字来重置let关键字声明的变量。
let关键字在不同作用域，或不用块级作用域中是可以重新声明赋值的。
在相同的作用域或块级作用域中，不能使用const关键字来重置var和let关键字声明的变量。
在相同的作用域或块级作用域中，不能使用const关键字来重置const关键字声明的变量
const 关键字在不同作用域，或不同块级作用域中是可以重新声明赋值的:
var关键字定义的变量可以先使用后声明。
let关键字定义的变量需要先声明再使用。
const关键字定义的常量，声明时必须进行初始化，且初始化后不可再修改。

ES6 解构赋值

解构赋值是对赋值运算符的扩展
他是一种针对数组或者对象进行模式匹配，然后对其中的变量进行赋值
书写简单易懂，语义清晰明了，方便了对复杂对象中数据字段获取
解构模型分为：
解构的源，解构赋值表达式的右边部分。
解构的目标，解构赋值表达式的左边部分。
解构赋值的用途
1 、交换变量的值

let x='1';
let y='2';
[x,y]=[y,x]

2、从函数返回多个值

function example() {
  return [1, 2, 3];
}
var [a, b, c] = example();
 
// 返回一个对象
 
function example() {
  return {
    foo: 1,
    bar: 2
  };
}
var { foo, bar } = example();

3 、函数参数的定义

// 参数是一组有次序的值
function f([x, y, z]) { ... }
f([1, 2, 3])
// 参数是一组无次序的值
function f({x, y, z}) { ... }
f({z: 3, y: 2, x: 1})

4、提取JSON数据

var jsonData = {
  id: 42,
  status: "OK",
  data: [867, 5309]
}
let { id, status, data: number } = jsonData;
 
console.log(id, status, number)
// 42, OK, [867, 5309]

5、函数参数的默认值

jQuery.ajax = function (url, {
  async = true,
  beforeSend = function () {},
  cache = true,
  complete = function () {},
  crossDomain = false,
  global = true,
  // ... more config
}) {
  // ... do stuff
}; 

6、 遍历Map结构

var map = new Map();
map.set('first', 'hello');
map.set('second', 'world');
 
for (let [key, value] of map) {
  console.log(key + " is " + value);
}
// first is hello
// second is world
 
如果只想获取键名，或者只想获取键值，可以写成下面这样。    
// 获取键名
for (let [key] of map) {
  // ...
}
 
// 获取键值
for (let [,value] of map) {
  // ...
}  

ES6 Symbol

ES6 引入了一种新的原始数据类型 Symbol ，表示独一无二的值，最大的用法是用来定义对象的唯一属性名。
ES6 数据类型除了 Number 、 String 、 Boolean 、 Object、 null 和 undefined ，还新增了 Symbol 。

let sy = Symbol("KK");
console.log(sy);   // Symbol(KK)
typeof(sy);        // "symbol"
 
// 相同参数 Symbol() 返回的值不相等
let sy1 = Symbol("kk"); 
sy === sy1;       // false

ES6 Map 与 Set

Map 对象保存键值对。任何值(对象或者原始值) 都可以作为一个键或一个值。
maps和object的区别
一个 Object 的键只能是字符串或者 Symbols，但一个 Map 的键可以是任意值。
Map 中的键值是有序的（FIFO 原则），而添加到对象中的键则不是。
Map 的键值对个数可以从 size 属性获取，而 Object 的键值对个数只能手动计算。
Object 都有自己的原型，原型链上的键名有可能和你自己在对象上的设置的键名产生冲突。

对象	键	键值顺序	个数	迭代
object	字符串/symbols	无序	手动计算	手动计算
maps	任意值 (字符串/对象/函数/NaN/)	有序（FIFO原则）	通过size	通过size

数据访问
Map 想要访问元素，可以使用 Map 本身的原生方法：

map.get(1)

Object 可以通过 . 和 [ ] 来访问

obj.id;
obj['id'];

判断某个元素是否在 Map 中可以使用

	map.has(1);

判断某个元素是不是在 Object 中需要以下操作：

	obj.id === undefined;
	// 或者
	'id' in obj;

ES6 Reflect 与 Proxy

proxy 是设计模式的一种，代理模式
语法：

	new Proxy(target,handler)
	// target被代理的对象
	// handler 对代理的对象做什么操作
	
	var obj = new Proxy({}, {
	  get: function (target, key, receiver) {
	    console.log(`getting ${key}!`);
	    return Reflect.get(target, key, receiver);
	  },
	  set: function (target, key, value, receiver) {
	    console.log(`setting ${key}!`);
	    return Reflect.set(target, key, value, receiver);
	  }
	});

参数	作用
target	用Proxy包装的目标对象（可以是任何类型，数组/对象/函数/或者另一个代理）
handler	一个对象，其属性是当执行一个操作时定义代理的行为的函数

handler	方法	作用
set(target,propkey,receiver)	修改	拦截对象属性的设置,（如 proxy.foo=v），返回一个布尔值
get(target, propKey, value, receiver)	读取	截对象属性的读取（如 proxy.foo），最后一个参数是可选参数，参见下面 Reflect.get 部分
has(target,propKye)	判断对象是否有该属性	拦截 propKey in proxy 的操作，返回一个布尔值
deleteProperty()	拦截 delete 操作	拦截 delete proxy[propKey] 的操作，返回一个布尔值，如果这个方法抛出错误或者返回 false，当前属性就无法被 delete 命令删除
ownKeys(target)		拦截 Object.getOwnPropertyNames(proxy) Object.getOwnPropertySymbols(proxy) Object.keys(proxy) 返回一个数组
getOwnPropertyDescriptor(target,propKey)	getOwnPropertyDescriptor 方法拦截 Object.getOwnPropertyDescriptor，返回一个属性描述对象或者 undefined	拦截 Object.getOwnPropertyDescriptor(proxy,propKey)，返回属性的描述对象
defineProperty(target,propKey,propDesc)	defineProperty 方法拦截了 Object.defineProperty 操作	拦截 Object.defineProperty(proxy,propKey,PropDesc) Object.defineProperties(propxy,propDescs) 返回一个布尔值
preventExtensions(target)	拦截 Object.preventExtensions	拦截 Object.preventExtensions(proxy)，返回一个对象
getPrototypeOf(target)	getPrototypeOf 方法主要用来拦截获取对象原型	拦截 Object.getPrototypeOf(proxy)，返回一个对象
isExtensible(target)		拦截 Object.isExtensible(proxy)，返回一个布尔值
setPrototypeOf(target,proto)	getPrototypeOf 方法主要用来拦截设置对象原型	拦截 Object.setPrototypeOf(proxy,proto)，返回一个布尔值。如果目标对象是函数，那么还有两种额外操作可以拦截
apply(target,object,args)	拦截函数的调用、call 和 apply 操作，	拦截 Proxy 实例，并将其作为函数调用的操作，比如 proxy(…args) proxy.call(object,…args) proxy.apply(…)
construct(target,args)	拦截 new 命令	拦截 Proxy 实例作为构造函数调用的操作，比如 new proxy(…args)

参考 es6 proxy
Reflect 映出
ES6 中将 Object 的一些明显属于语言内部的方法移植到了 Reflect 对象上（当前某些方法会同时存在于 Object 和 Reflect 对象上），未来的新方法会只部署在 Reflect 对象上。
Reflect 对象对某些方法的返回结果进行了修改，使其更合理。
Reflect 对象使用函数的方式实现了 Object 的命令式操作。
静态方法

Reflect.get(target, name, receiver)
Reflect.set(target, name, value, receiver)
Reflect.has(obj, name)
Reflect.deleteProperty(obj, property)
Reflect.construct(obj, args)
Reflect.getPrototypeOf(obj)
Reflect.setPrototypeOf(obj, newProto)
Reflect.apply(func, thisArg, args)
Reflect.defineProperty(target, propertyKey, attributes)
Reflect.getOwnPropertyDescriptor(target, propertyKey)
Reflect.isExtensible(target)
Reflect.preventExtensions(target)
Reflect.ownKeys(target)

proxy与reflect的组合使用

let exam = {
    name: "Tom",
    age: 24
}
let handler = {
    get: function(target, key){
        console.log("getting "+key);
        return Reflect.get(target,key);
    },
    set: function(target, key, value){
        console.log("setting "+key+" to "+value)
        Reflect.set(target, key, value);
    }
}
let proxy = new Proxy(exam, handler)
proxy.name = "Jerry"
proxy.name
// setting name to Jerry
// getting name
// "Jerry"