本文章是根據(jù)以下文章內(nèi)容整理的：
前言
自從ES6發(fā)布以來(lái)莹规，就受到了廣大開(kāi)發(fā)者的歡迎它的新特性解決了很多實(shí)際開(kāi)發(fā)的痛點(diǎn)璧微，并且使得JavaScript逐步成為一門(mén)能夠開(kāi)發(fā)大型企業(yè)應(yīng)用的編程語(yǔ)言，基于這種技術(shù)環(huán)境下，很多公司都將ES6視為開(kāi)發(fā)的其中一個(gè)標(biāo)準(zhǔn)，因此在招聘人才時(shí)，也會(huì)對(duì)其進(jìn)行ES6知識(shí)的考察银酗。
箭頭函數(shù)
*當(dāng)要求動(dòng)態(tài)上下文時(shí)，就不能使用箭頭函數(shù)，也就是this的固定化黍特。
1蛙讥、在使用=>定義函數(shù)時(shí)，this的指向是定義時(shí)所在的對(duì)象衅澈，而不是使用時(shí)所在的對(duì)象【function是使用時(shí)所在的對(duì)象】键菱；
2、不能用做構(gòu)造函數(shù)今布，也就是不能使用new命令经备，否則機(jī)會(huì)拋出一個(gè)錯(cuò)誤；
3部默、不能使用arguments對(duì)象侵蒙；
4、不能使用yield命令傅蹂；
原生js
class Animal {
? ? constructor(){
? ? ? ? this.type = "animal";
? ? }
? ? say(val) {
????????setTimeout(function(){
? ? ? ? ? ? console.log(this);? ? ? ? //window
? ? ? ? ? ? console.log(this.type + "says" + val)
????????}, 1000)
}
var animal = new Animal();
animal.say("Hi")? ? ? ? //undefined says hi
箭頭函數(shù)：
class Animal {
? ? constructor(){
? ? ? ? this.type = "animal";
? ? }
? ? say(val) {
? ? ? ? setTimeout(() => {
? ? ? ? ? ? console.log(this);? ? ? ? //animal
? ? ? ? ? ? console.log(this.type + "says" + val);
????????}, 1000)
? ? }
}
var animal = new Animal();
animal.say("Hi");? ? ? ? ? ?//animal says Hi
【特點(diǎn)】
? ? ·不需要關(guān)鍵字function創(chuàng)建函數(shù)? ?
? ? ·省略return關(guān)鍵字
? ? ·繼承當(dāng)前上下文的this關(guān)鍵字
let與var區(qū)別傳送門(mén)
作用域：
-通過(guò)var定義的變量纷闺，作用域是整個(gè)封閉函數(shù)，全域的份蝴；
-通過(guò)let定義的變量犁功，作用域是在塊級(jí)或者子級(jí)中；
【只要塊級(jí)作用域存在let命令婚夫，他所聲明的變量就會(huì)綁定這個(gè)作用域浸卦，不再受外部影響】
【let不允許相同作用域重復(fù)聲明同一個(gè)變量】
變量提升：
瀏覽器在運(yùn)行代碼之前會(huì)進(jìn)行預(yù)解析，首先解析函數(shù)聲明案糙、定義變量限嫌，解析完成之后在對(duì)函數(shù)進(jìn)行運(yùn)行、變量進(jìn)行賦值等时捌；
-不論var生命的變量處于當(dāng)前作用域的第幾行怒医，都會(huì)提升到作用域的頂部，并且初始化為undefined奢讨；
-而let聲明的變量同樣不論處于當(dāng)前作用域的第幾行稚叹，都會(huì)提升到作用域的頂部，當(dāng)賦值時(shí)才會(huì)被初始化拿诸∪肼迹【只用let聲明變量，但是不賦值佳镜，會(huì)被初始化為undefined】
console.log(foo)? ? //undefined
var foo = 1;
相當(dāng)于
var foo;
console.log(foo);? ? //undefined
foo = 1;
console.log(a)? ? //報(bào)錯(cuò)
let a = 1;
但是直接用let聲明變量不賦值是會(huì)打印undefined，還是初始化了凡桥，只是let放在賦值之后蟀伸，let聲明會(huì)提前但不會(huì)初始化。
let a;
console.log(a)? ? //undefined
console.log(a);? ? //報(bào)錯(cuò)
let a;
Set數(shù)據(jù)結(jié)構(gòu)
ES6提供了新的數(shù)據(jù)結(jié)構(gòu) Set。
特性：
類(lèi)似于數(shù)組啊掏，但是它的一大特性就是所有元素都是唯一的蠢络，沒(méi)有重復(fù)。
我們利用這唯一特性可以對(duì)數(shù)組進(jìn)行去重操作迟蜜；
單一數(shù)組的去重：
let set = new Set([1,2,2,2,3]);? ? //Set(2) {1,2,3}
多數(shù)組的合并去重：
let arr1 = [1,2,3,4]
let arr2 = [2,3,4,5]
let set = new Set([...arr1, ...arr2]);? ? //Set{1,2,3,4,5}
//對(duì)象中的擴(kuò)展運(yùn)算符(...)用于取出參數(shù)對(duì)象中的所有可遍歷屬性刹孔，拷貝到當(dāng)前對(duì)象之中
操作：
1、向Set中添加元素
let set1? =new Set()
set1.add(1)
set1.add(2)
console.log(set1)? ? //{1,2,3}
2娜睛、從set中刪除元素髓霞；
var set1 = new Set();
set1.add(1)
set1.add(2)
set1.delete(1)
console.log(set1)? ? //{2}
3、判斷某元素是否存在畦戒；
let set = new Set()
set.add(1);
set.add(2);
set.delete(1);
set.has(1);? ? //false
set.has(2);? ? //true
4方库、清除所有元素
let set = new Set();
set.add(1)
set.clear()? ? //{}
Set和Array互轉(zhuǎn)
1、數(shù)組轉(zhuǎn)Set
let set1 = new Set([1,2,3]);? ? // Set{1,2,3}
let set2 = new Set(new Array(1,2,3));? ? // Set{1,2,3}
2障斋、Set轉(zhuǎn)數(shù)組
var set = new Set([1,2,3]);
console.log([...set]);? ? //[1,2,3]
console.log(Array.from(set));? ? //[1,2,3]
遍歷
可以使用set實(shí)例對(duì)象的keys()纵潦、values()、entries()方法進(jìn)行遍歷垃环；
由于Set的鍵名和鍵值是同一個(gè)值邀层，它的每一個(gè)元素的key和value是相同的，所有的keys()和values()返回的值都是相同的遂庄，entrise()返回元素中的key和value是相同的寥院。
let set1 = new Set([1,2,'hello'])
for(let item of set1.keys()){
? ? console.log(item);? ? //1,2,'hello'
}
for(let item of set1.values()){
? ? console.log(item);? ? //1,2,'hello'
}
for(let item of set1.entries()){
? ??? console.log(item);? ? //[1,1][2,2]['hello','hello']
}
其他特性：
在向Set加入值時(shí)，Set不會(huì)轉(zhuǎn)換數(shù)據(jù)類(lèi)型涧团，內(nèi)部在判斷元素是否存在時(shí)用的類(lèi)似與精確等于(===)的方法只磷，“2”和2是不同的，NaN等于自身泌绣；
var set = new Set()
set.add(NaN);
set.add(NaN);
console.log(set);? ? //Set {NaN}
模版字符串
*就是這種形式${varible}钮追，在以往的時(shí)候我們?cè)谶B接字符串和變量時(shí)需要使用這種‘string’+varible+‘string’但是有了模版語(yǔ)言后，我們可以使用string${varible}string這種進(jìn)行連接阿迈。
在ES5時(shí)元媚，我們通常使用‘\’反斜杠來(lái)做多行字符串或者字符串一行行拼接，ES6反引號(hào)（``）可以直接搞定苗沧。
//ES5vartemplate = "hello \
world";
console.log(template); //hello world//ES6const template = `hello
world`;
console.log(template); //hello 空行 world
Promise
promise是一個(gè)構(gòu)造函數(shù)
function demo(){
? ? var p = new Promise(function(resolve,reject){
? ? ? ? setTimeout(function(){
? ? ? ? ? ? console.log('執(zhí)行完成')
? ? ? ? ? ? resolve('隨便一些數(shù)據(jù)')
????????},1000)
????})
? ? return p;
}
demo();? ? //執(zhí)行完成
demo().then(function(data){? ? //data:p
? ? console.log(data)? ? //兩秒后：執(zhí)行完成 隨便一些數(shù)據(jù)
})
在demo函數(shù)執(zhí)行返回直接調(diào)用then方法刊棕，then接受一個(gè)參數(shù)【函數(shù)】。并且會(huì)拿到我們?cè)赿emo中調(diào)用resolve時(shí)傳的參數(shù)待逞。
then里面的函數(shù)跟我們平時(shí)用的回調(diào)函數(shù)一樣甥角，能夠在demo這個(gè)異步任務(wù)執(zhí)行完成之后被執(zhí)行。
promise比傳遞callback函數(shù)靈活的多：
demo()
.then(function(data){
? ? console.log(data + '1')
})
.then(function(data){
? ? console.log(data + '2')
})
...
reject用法
function getNum(){
? ? var p = new Promise(function(resolve, reject){
? ? ? ? setTimeout(function(){
? ? ? ? ? ? var num = Math.ceil(Math.random()*10)
? ? ? ? ? ? if(num <= 5){
? ? ? ? ? ? ? ? resolve(num)
????????????}else {
? ? ? ? ? ? ? ? reject('數(shù)字太大了')
????????????}
????????}, 1000)
????})
????return p;
}
getNum().then(function(data){
? ? console.log('resolve')
? ? console.log(data)
}, function(p,data){
? ? console.log('reject')
? ? console.log(p)
})
catch用法
getNum().then(function(data){
????console.log('resolved')
?????console.log(data)
}).catch(function(p){
????console.log('rejected')
????console.log(p)
})
*all用法
Promise.all([runAsync1(), runAsync2(), runAsync3()]).then(function(results){
????console.log(results);
})
對(duì)象的拓展運(yùn)算符
對(duì)象中的拓展運(yùn)算符(...)用于取出參數(shù)對(duì)象中的所有可遍歷屬性识樱，拷貝到當(dāng)前對(duì)象中嗤无。
let bar = {a:1, b:2};
let baz = {...bar};? ? //{a:1, b: 2}
上面方法等價(jià)于：
let bar = {a:1,b:2};
let baz = Object.assign({},bar);? ? //{a:1,b:2}
Object.assign()方法用于對(duì)象的合并震束，將源對(duì)象【source】的所有可枚舉屬性，復(fù)制到目標(biāo)對(duì)象【target】当犯。
Object.assign()方法的第一個(gè)參數(shù)是目標(biāo)對(duì)象垢村，后面的參數(shù)都是源對(duì)象『课溃【如果目標(biāo)對(duì)象與源對(duì)象有同名屬性嘉栓，或者多個(gè)源對(duì)象有同名屬性，則后面的屬性會(huì)覆蓋前面的屬性】
同樣拓诸，如果用戶(hù)自定義的屬性侵佃，放在擴(kuò)展運(yùn)算符后年，則擴(kuò)展運(yùn)算符內(nèi)部的同名屬性會(huì)被覆蓋恰响。
let bar = {a:1.b2};
let baz = {...bar,...{a:2,b:4}}? ? //{a:2,b:4}
數(shù)組的擴(kuò)展運(yùn)算符
拓展同樣可以運(yùn)用在對(duì)數(shù)組的操作中趣钱。
可以將數(shù)組轉(zhuǎn)換為參數(shù)序列
function add(x,y){
? ? return x+y;
}
const numbers = [2,3];
add(...numbers);? ? //5
可以復(fù)制數(shù)組
let arr = [1,2,3];
let arr1 = [...arr];? ? //[1,2,3]
