總結(jié)：

var? let const的區(qū)別

數(shù)組新增拓展

對(duì)象新增拓展

函數(shù)新增拓展

Set 和 Map

Promise

Generator

Proxy

Module

Decorator

具體介紹：

1.var? let? const

一昼窗、var

1、在ES5中位谋，頂層對(duì)象的屬性和全局變量是等價(jià)的茸俭，用var聲明的變量既是全局變量痊硕，也是頂層變量：

頂層對(duì)象，在瀏覽器環(huán)境指的是window對(duì)象，在 Node 指的是global對(duì)象

2静暂、使用var聲明的變量存在變量提升的情況

3聊倔、使用var晦毙，我們能夠?qū)σ粋€(gè)變量進(jìn)行多次聲明，后面聲明的變量會(huì)覆蓋前面的變量聲明：

在函數(shù)中使用使用var聲明變量時(shí)候耙蔑，該變量是局部的

而如果在函數(shù)內(nèi)不使用var见妒，該變量是全局的

二、let

1甸陌、let是ES6新增的命令徐鹤，用來聲明變量

2、用法類似于var邀层，但是所聲明的變量返敬，只在let命令所在的代碼塊內(nèi)有效，不存在變量提：

只要塊級(jí)作用域內(nèi)存在let命令寥院，這個(gè)區(qū)域就不再受外部影響

3劲赠、使用let聲明變量前，該變量都不可用秸谢，也就是大家常說的暫時(shí)性死區(qū)：

let不允許在相同作用域中重復(fù)聲明

注意的是相同作用域凛澎，下面這種情況是不會(huì)報(bào)錯(cuò)的，因此估蹄，我們不能在函數(shù)內(nèi)部重新聲明參數(shù)

三塑煎、const

1、const聲明一個(gè)只讀的常量臭蚁，一旦聲明最铁，常量的值就不能改變：

const一旦聲明變量讯赏，就必須立即初始化，不能留到以后賦值

如果之前用var或let聲明過變量冷尉，再用const聲明同樣會(huì)報(bào)錯(cuò)

2漱挎、const實(shí)際上保證的并不是變量的值不得改動(dòng)，而是變量指向的那個(gè)內(nèi)存地址所保存的數(shù)據(jù)不得改動(dòng)：

對(duì)于簡單類型的數(shù)據(jù)雀哨，值就保存在變量指向的那個(gè)內(nèi)存地址磕谅，因此等同于常量

對(duì)于復(fù)雜類型的數(shù)據(jù)，變量指向的內(nèi)存地址雾棺，保存的只是一個(gè)指向?qū)嶋H數(shù)據(jù)的指針膊夹，const只能保證這個(gè)指針是固定的，并不能確保改變量的結(jié)構(gòu)不變

四捌浩、區(qū)別

1放刨、變量提升：

var聲明的變量存在變量提升，即變量可以在聲明之前調(diào)用嘉栓，值為undefined

let和const不存在變量提升宏榕，即它們所聲明的變量一定要在聲明后使用，否則報(bào)錯(cuò)

2侵佃、暫時(shí)性死區(qū)：

var不存在暫時(shí)性死區(qū)

let和const存在暫時(shí)性死區(qū)麻昼，只有等到聲明變量的那一行代碼出現(xiàn)秫舌，才可以獲取和使用該變量

3抽活、塊級(jí)作用域：

var不存在塊級(jí)作用域

let和const存在塊級(jí)作用域

4、重復(fù)聲明：

var允許重復(fù)聲明變量

let和const在同一作用域不允許重復(fù)聲明變量

5崩泡、修改聲明的變量：

var和let可以

const聲明一個(gè)只讀的常量迈螟。一旦聲明叉抡，常量的值就不能改變

五、使用

能用const的情況盡量使用const答毫，其他情況下大多數(shù)使用let褥民，避免使用var

二? 數(shù)組新增拓展

一、擴(kuò)展運(yùn)算符的應(yīng)用

1洗搂、ES6通過擴(kuò)展元素符...消返，好比 rest 參數(shù)的逆運(yùn)算，將一個(gè)數(shù)組轉(zhuǎn)為用逗號(hào)分隔的參數(shù)序列：

主要用于函數(shù)調(diào)用的時(shí)候耘拇，將一個(gè)數(shù)組變?yōu)閰?shù)序列

可以將某些數(shù)據(jù)結(jié)構(gòu)轉(zhuǎn)為數(shù)組撵颊，能夠更簡單實(shí)現(xiàn)數(shù)組復(fù)制，數(shù)組的合并也更為簡潔

2惫叛、擴(kuò)展運(yùn)算符可以與解構(gòu)賦值結(jié)合起來倡勇，用于生成數(shù)組。如果將擴(kuò)展運(yùn)算符用于數(shù)組賦值嘉涌，只能放在參數(shù)的最后一位妻熊，否則會(huì)報(bào)錯(cuò)：

可以將字符串轉(zhuǎn)為真正的數(shù)組

3夸浅、定義了遍歷器（Iterator）接口的對(duì)象，都可以用擴(kuò)展運(yùn)算符轉(zhuǎn)為真正的數(shù)組固耘。如果對(duì)沒有 Iterator 接口的對(duì)象题篷，使用擴(kuò)展運(yùn)算符词身，將會(huì)報(bào)錯(cuò)

二厅目、構(gòu)造函數(shù)新增的方法

1、Array.from()：將兩類對(duì)象轉(zhuǎn)為真正的數(shù)組：類似數(shù)組的對(duì)象和可遍歷（iterable）的對(duì)象（包括 ES6 新增的數(shù)據(jù)結(jié)構(gòu) Set 和 Map）

可以接受第二個(gè)參數(shù)法严，用來對(duì)每個(gè)元素進(jìn)行處理损敷，將處理后的值放入返回的數(shù)組

2、Array.of()：用于將一組值深啤，轉(zhuǎn)換為數(shù)組

沒有參數(shù)的時(shí)候拗馒，返回一個(gè)空數(shù)組

當(dāng)參數(shù)只有一個(gè)的時(shí)候，實(shí)際上是指定數(shù)組的長度

參數(shù)個(gè)數(shù)不少于 2 個(gè)時(shí)溯街，Array()才會(huì)返回由參數(shù)組成的新數(shù)組

三诱桂、實(shí)例對(duì)象新增的方法

1、copyWithin()：將指定位置的成員復(fù)制到其他位置（會(huì)覆蓋原有成員）呈昔，然后返回當(dāng)前數(shù)組

target（必需）：從該位置開始替換數(shù)據(jù)挥等。如果為負(fù)值，表示倒數(shù)堤尾。

start（可選）：從該位置開始讀取數(shù)據(jù)肝劲，默認(rèn)為 0。如果為負(fù)值郭宝，表示從末尾開始計(jì)算辞槐。

end（可選）：到該位置前停止讀取數(shù)據(jù)，默認(rèn)等于數(shù)組長度粘室。如果為負(fù)值榄檬，表示從末尾開始計(jì)算。

2衔统、find()鹿榜、findIndex()：find()用于找出第一個(gè)符合條件的數(shù)組成員

參數(shù)是一個(gè)回調(diào)函數(shù)，接受三個(gè)參數(shù)依次為當(dāng)前的值缰冤、當(dāng)前的位置和原數(shù)組

findIndex返回第一個(gè)符合條件的數(shù)組成員的位置犬缨，如果所有成員都不符合條件，則返回-1

這兩個(gè)方法都可以接受第二個(gè)參數(shù)棉浸，用來綁定回調(diào)函數(shù)的this對(duì)象

3怀薛、fill()：使用給定值，填充一個(gè)數(shù)組

還可以接受第二個(gè)和第三個(gè)參數(shù)迷郑，用于指定填充的起始位置和結(jié)束位置

注意枝恋，如果填充的類型為對(duì)象创倔，則是淺拷貝

4、entries()焚碌，keys()畦攘，values()：

keys()是對(duì)鍵名的遍歷

values()是對(duì)鍵值的遍歷

entries()是對(duì)鍵值對(duì)的遍歷

5、includes()：用于判斷數(shù)組是否包含給定的值

方法的第二個(gè)參數(shù)表示搜索的起始位置十电，默認(rèn)為0

參數(shù)為負(fù)數(shù)則表示倒數(shù)的位置

6知押、flat()，flatMap()：將數(shù)組扁平化處理鹃骂，返回一個(gè)新數(shù)組台盯，對(duì)原數(shù)據(jù)沒有影響

flat()：默認(rèn)只會(huì)“拉平”一層，如果想要“拉平”多層的嵌套數(shù)組畏线，可以將flat()方法的參數(shù)寫成一個(gè)整數(shù)静盅，表示想要拉平的層數(shù)，默認(rèn)為1

flatMap()方法對(duì)原數(shù)組的每個(gè)成員執(zhí)行一個(gè)函數(shù)相當(dāng)于執(zhí)行Array.prototype.map()寝殴，然后對(duì)返回值組成的數(shù)組執(zhí)行flat()方法蒿叠。該方法返回一個(gè)新數(shù)組，不改變?cè)瓟?shù)組蚣常。flatMap()方法還可以有第二個(gè)參數(shù)市咽，用來綁定遍歷函數(shù)里面的this

四、數(shù)組的空位

1史隆、數(shù)組的空位指魂务，數(shù)組的某一個(gè)位置沒有任何值

ES6 則是明確將空位轉(zhuǎn)為undefined

包括Array.from、擴(kuò)展運(yùn)算符泌射、copyWithin()粘姜、fill()、entries()熔酷、keys()孤紧、values()、find()和findIndex()

3.對(duì)象新增拓展

一拒秘、屬性的簡寫

1号显、ES6中，當(dāng)對(duì)象鍵名與對(duì)應(yīng)值名相等的時(shí)候躺酒，可以進(jìn)行簡寫押蚤。方法也能夠進(jìn)行簡寫。在函數(shù)內(nèi)作為返回值羹应，也會(huì)變得方便很多：

注意：簡寫的對(duì)象方法不能用作構(gòu)造函數(shù)揽碘，否則會(huì)報(bào)錯(cuò)

二、屬性名表達(dá)式

1、ES6 允許字面量定義對(duì)象時(shí)雳刺，將表達(dá)式放在括號(hào)內(nèi)劫灶。表達(dá)式還可以用于定義方法名：

注意，屬性名表達(dá)式與簡潔表示法掖桦，不能同時(shí)使用本昏，會(huì)報(bào)錯(cuò)

注意，屬性名表達(dá)式如果是一個(gè)對(duì)象枪汪，默認(rèn)情況下會(huì)自動(dòng)將對(duì)象轉(zhuǎn)為字符串[object Object]

三涌穆、super關(guān)鍵字

this關(guān)鍵字總是指向函數(shù)所在的當(dāng)前對(duì)象，ES6 又新增了另一個(gè)類似的關(guān)鍵字super料饥，指向當(dāng)前對(duì)象的原型對(duì)象

四蒲犬、擴(kuò)展運(yùn)算符的應(yīng)用

1朱监、在解構(gòu)賦值中岸啡，未被讀取的可遍歷的屬性，分配到指定的對(duì)象上面：

注意：解構(gòu)賦值必須是最后一個(gè)參數(shù)赫编，否則會(huì)報(bào)錯(cuò)

2巡蘸、解構(gòu)賦值是淺拷貝。對(duì)象的擴(kuò)展運(yùn)算符等同于使用Object.assign()方法

五擂送、屬性的遍歷

1悦荒、ES6 一共有 5 種方法可以遍歷對(duì)象的屬性：

for...in：循環(huán)遍歷對(duì)象自身的和繼承的可枚舉屬性（不含 Symbol 屬性）

Object.keys(obj)：返回一個(gè)數(shù)組，包括對(duì)象自身的（不含繼承的）所有可枚舉屬性（不含 Symbol 屬性）的鍵名

Object.getOwnPropertyNames(obj)：回一個(gè)數(shù)組嘹吨，包含對(duì)象自身的所有屬性（不含 Symbol 屬性搬味，但是包括不可枚舉屬性）的鍵名

Object.getOwnPropertySymbols(obj)：返回一個(gè)數(shù)組，包含對(duì)象自身的所有 Symbol 屬性的鍵名

Reflect.ownKeys(obj)：返回一個(gè)數(shù)組蟀拷，包含對(duì)象自身的（不含繼承的）所有鍵名碰纬，不管鍵名是 Symbol 或字符串，也不管是否可枚舉

2问芬、上述遍歷悦析，都遵守同樣的屬性遍歷的次序規(guī)則：

首先遍歷所有數(shù)值鍵，按照數(shù)值升序排列

其次遍歷所有字符串鍵此衅，按照加入時(shí)間升序排列

最后遍歷所有 Symbol 鍵强戴，按照加入時(shí)間升序排

六、對(duì)象新增的方法

1挡鞍、Object.is()：嚴(yán)格判斷兩個(gè)值是否相等骑歹，與嚴(yán)格比較運(yùn)算符（===）的行為基本一致，不同之處只有兩個(gè)：一是+0不等于-0墨微，二是NaN等于自身

2道媚、Object.assign()：

Object.assign()方法用于對(duì)象的合并，將源對(duì)象source的所有可枚舉屬性，復(fù)制到目標(biāo)對(duì)象target

Object.assign()方法的第一個(gè)參數(shù)是目標(biāo)對(duì)象衰琐，后面的參數(shù)都是源對(duì)象

注意：Object.assign()方法是淺拷貝也糊，遇到同名屬性會(huì)進(jìn)行替換

3、Object.getOwnPropertyDescriptors()：返回指定對(duì)象所有自身屬性（非繼承屬性）的描述對(duì)象

4羡宙、Object.setPrototypeOf()：用來設(shè)置一個(gè)對(duì)象的原型對(duì)象

5狸剃、Object.getPrototypeOf()：用于讀取一個(gè)對(duì)象的原型對(duì)象

6、Object.keys()：返回自身的（不含繼承的）所有可遍歷（enumerable）屬性的鍵名的數(shù)組

7狗热、Object.values()：返回自身的（不含繼承的）所有可遍歷（enumerable）屬性的鍵對(duì)應(yīng)值的數(shù)組

8钞馁、Object.entries()：返回一個(gè)對(duì)象自身的（不含繼承的）所有可遍歷（enumerable）屬性的鍵值對(duì)的數(shù)組

9、Object.fromEntries()：用于將一個(gè)鍵值對(duì)數(shù)組轉(zhuǎn)為對(duì)象

4.函數(shù)新增拓展

一匿刮、參數(shù)

1僧凰、ES6允許為函數(shù)的參數(shù)設(shè)置默認(rèn)值：

函數(shù)的形參是默認(rèn)聲明的，不能使用let或const再次聲明

參數(shù)默認(rèn)值可以與解構(gòu)賦值的默認(rèn)值結(jié)合起來使用

當(dāng)參數(shù)為對(duì)象的時(shí)候才能進(jìn)行解構(gòu)熟丸，如果沒有提供參數(shù)的時(shí)候训措，變量x和y就不會(huì)生成，從而報(bào)錯(cuò)光羞，這里設(shè)置默認(rèn)值避免

參數(shù)默認(rèn)值應(yīng)該是函數(shù)的尾參數(shù)绩鸣，如果不是非尾部的參數(shù)設(shè)置默認(rèn)值，實(shí)際上這個(gè)參數(shù)是沒發(fā)省略的

二纱兑、屬性

1呀闻、length：

length將返回沒有指定默認(rèn)值的參數(shù)個(gè)數(shù)

rest 參數(shù)也不會(huì)計(jì)入length屬性

如果設(shè)置了默認(rèn)值的參數(shù)不是尾參數(shù)，那么length屬性也不再計(jì)入后面的參數(shù)了

2潜慎、name：

返回該函數(shù)的函數(shù)名

如果將一個(gè)具名函數(shù)賦值給一個(gè)變量捡多，則 name屬性都返回這個(gè)具名函數(shù)原本的名字

Function構(gòu)造函數(shù)返回的函數(shù)實(shí)例，name屬性的值為anonymous

bind返回的函數(shù)铐炫，name屬性值會(huì)加上bound前綴

三垒手、作用域

1、一旦設(shè)置了參數(shù)的默認(rèn)值驳遵，函數(shù)進(jìn)行聲明初始化時(shí)淫奔，參數(shù)會(huì)形成一個(gè)單獨(dú)的作用域

2、等到初始化結(jié)束堤结，這個(gè)作用域就會(huì)消失唆迁。這種語法行為，在不設(shè)置參數(shù)默認(rèn)值時(shí)竞穷，是不會(huì)出現(xiàn)的

四唐责、嚴(yán)格模式

只要函數(shù)參數(shù)使用了默認(rèn)值、解構(gòu)賦值瘾带、或者擴(kuò)展運(yùn)算符鼠哥，那么函數(shù)內(nèi)部就不能顯式設(shè)定為嚴(yán)格模式，否則會(huì)報(bào)錯(cuò)

五、箭頭函數(shù)

1朴恳、如果箭頭函數(shù)不需要參數(shù)或需要多個(gè)參數(shù)抄罕，就使用一個(gè)圓括號(hào)代表參數(shù)部分

2、如果箭頭函數(shù)的代碼塊部分多于一條語句于颖，就要使用大括號(hào)將它們括起來呆贿，并且使用return語句返回

3、如果返回對(duì)象森渐，需要加括號(hào)將對(duì)象包裹

4做入、注意點(diǎn)：

函數(shù)體內(nèi)的this對(duì)象，就是定義時(shí)所在的對(duì)象同衣，而不是使用時(shí)所在的對(duì)象

不可以當(dāng)作構(gòu)造函數(shù)竟块，也就是說，不可以使用new命令耐齐，否則會(huì)拋出一個(gè)錯(cuò)誤

不可以使用arguments對(duì)象浪秘，該對(duì)象在函數(shù)體內(nèi)不存在。如果要用蚪缀，可以用 rest 參數(shù)代替

不可以使用yield命令秫逝，因此箭頭函數(shù)不能用作 Generator 函數(shù)

5.Set Map

一、定義

1询枚、Set是一種叫做集合的數(shù)據(jù)結(jié)構(gòu)，Map是一種叫做字典的數(shù)據(jù)結(jié)構(gòu)

2浙巫、什么是集合和字典：

集合：是由一堆無序的金蜀、相關(guān)聯(lián)的，且不重復(fù)的內(nèi)存結(jié)構(gòu)【數(shù)學(xué)中稱為元素】組成的組合

字典：是一些元素的集合的畴。每個(gè)元素有一個(gè)稱作key 的域渊抄，不同元素的key 各不相同

3、區(qū)別：

共同點(diǎn)：集合丧裁、字典都可以存儲(chǔ)不重復(fù)的值

不同點(diǎn)：集合是以[值护桦，值]的形式存儲(chǔ)元素，字典是以[鍵煎娇，值]的形式存儲(chǔ)

二二庵、Set

1、Set是es6新增的數(shù)據(jù)結(jié)構(gòu)缓呛，類似于數(shù)組催享，但是成員的值都是唯一的，沒有重復(fù)的值哟绊，我們一般稱為集合

Set本身是一個(gè)構(gòu)造函數(shù)因妙，用來生成 Set 數(shù)據(jù)結(jié)構(gòu)

2、增刪改查：

add()：添加某個(gè)值，返回 Set 結(jié)構(gòu)本身攀涵。當(dāng)添加實(shí)例中已經(jīng)存在的元素铣耘，set不會(huì)進(jìn)行處理添加

delete()：刪除某個(gè)值，返回一個(gè)布爾值以故，表示刪除是否成功

has()：返回一個(gè)布爾值涡拘，判斷該值是否為Set的成員

clear()：清除所有成員，沒有返回值

2据德、遍歷：

keys()：返回鍵名的遍歷器

values()：返回鍵值的遍歷器

entries()：返回鍵值對(duì)的遍歷器

forEach()：使用回調(diào)函數(shù)遍歷每個(gè)成員

3鳄乏、Set的遍歷順序就是插入順序：

keys方法、values方法棘利、entries方法返回的都是遍歷器對(duì)象

forEach()用于對(duì)每個(gè)成員執(zhí)行某種操作橱野，沒有返回值，鍵值善玫、鍵名都相等水援，同樣的forEach方法有第二個(gè)參數(shù)，用于綁定處理函數(shù)的this

擴(kuò)展運(yùn)算符和Set 結(jié)構(gòu)相結(jié)合實(shí)現(xiàn)數(shù)組或字符串去重

實(shí)現(xiàn)并集茅郎、交集蜗元、和差集

三、Map

1系冗、Map類型是鍵值對(duì)的有序列表奕扣，而鍵和值都可以是任意類型

Map本身是一個(gè)構(gòu)造函數(shù)，用來生成 Map 數(shù)據(jù)結(jié)構(gòu)

2掌敬、增刪改查：

size：size屬性返回 Map 結(jié)構(gòu)的成員總數(shù)惯豆。

set()：設(shè)置鍵名key對(duì)應(yīng)的鍵值為value，然后返回整個(gè) Map 結(jié)構(gòu)奔害。如果key已經(jīng)有值楷兽，則鍵值會(huì)被更新，否則就新生成該鍵华临。同時(shí)返回的是當(dāng)前Map對(duì)象芯杀，可采用鏈?zhǔn)綄懛?/p>

get()：get方法讀取key對(duì)應(yīng)的鍵值，如果找不到key雅潭，返回undefined

has()：has方法返回一個(gè)布爾值揭厚，表示某個(gè)鍵是否在當(dāng)前 Map 對(duì)象之中

delete()：delete方法刪除某個(gè)鍵，返回true寻馏。如果刪除失敗棋弥，返回false

clear()：clear方法清除所有成員，沒有返回值

3诚欠、遍歷：

keys()：返回鍵名的遍歷器

values()：返回鍵值的遍歷器

entries()：返回所有成員的遍歷器

forEach()：遍歷 Map 的所有成員

4顽染、遍歷順序就是插入順序

四漾岳、WeakSet

1、WeakSet可以接受一個(gè)具有 Iterable接口的對(duì)象作為參數(shù)

2粉寞、在API中WeakSet與Set有兩個(gè)區(qū)別：

沒有遍歷操作的API

沒有size屬性

3尼荆、WeackSet只能成員只能是引用類型，而不能是其他類型的值

4唧垦、WeakSet里面的引用只要在外部消失捅儒，它在 WeakSet里面的引用就會(huì)自動(dòng)消失

五、WeakMap

1振亮、WeakMap結(jié)構(gòu)與Map結(jié)構(gòu)類似巧还，也是用于生成鍵值對(duì)的集合

2、在API中WeakMap與Map有兩個(gè)區(qū)別：

沒有遍歷操作的API

沒有clear清空方法

3坊秸、WeakMap只接受對(duì)象作為鍵名（null除外）麸祷，不接受其他類型的值作為鍵名

4、WeakMap的鍵名所指向的對(duì)象褒搔，一旦不再需要阶牍，里面的鍵名對(duì)象和所對(duì)應(yīng)的鍵值對(duì)會(huì)自動(dòng)消失，不用手動(dòng)刪除引用

6.Promise

一星瘾、定義

1走孽、Promise，譯為承諾琳状，是異步編程的一種解決方案磕瓷，比傳統(tǒng)的解決方案（回調(diào)函數(shù)）更加合理和更加強(qiáng)大

2、狀態(tài)：pending（進(jìn)行中）算撮、fulfilled（已成功）生宛、rejected（已失敗）

二肮柜、優(yōu)點(diǎn)

鏈?zhǔn)讲僮鳒p低了編碼難度

代碼可讀性明顯增強(qiáng)

三、特點(diǎn)

對(duì)象的狀態(tài)不受外界影響倒彰，只有異步操作的結(jié)果审洞，可以決定當(dāng)前是哪一種狀態(tài)

一旦狀態(tài)改變（從pending變?yōu)閒ulfilled和從pending變?yōu)閞ejected），就不會(huì)再變待讳，任何時(shí)候都可以得到這個(gè)結(jié)果

四芒澜、用法

1、Promise對(duì)象是一個(gè)構(gòu)造函數(shù)创淡，用來生成Promise實(shí)例：

const promise = new Promise(function(resolve, reject) {});

2痴晦、Promise構(gòu)造函數(shù)接受一個(gè)函數(shù)作為參數(shù)，該函數(shù)的兩個(gè)參數(shù)分別是resolve和reject：

resolve函數(shù)的作用是琳彩，將Promise對(duì)象的狀態(tài)從“未完成”變?yōu)椤俺晒Α?/p>

reject函數(shù)的作用是誊酌，將Promise對(duì)象的狀態(tài)從“未完成”變?yōu)椤笆?/p>

3部凑、實(shí)例方法：Promise構(gòu)建出來的實(shí)例存在以下方法

then()：then是實(shí)例狀態(tài)發(fā)生改變時(shí)的回調(diào)函數(shù)，第一個(gè)參數(shù)是resolved狀態(tài)的回調(diào)函數(shù)碧浊，第二個(gè)參數(shù)是rejected狀態(tài)的回調(diào)函數(shù)

catch()：catch()方法是.then(null, rejection)或.then(undefined, rejection)的別名涂邀，用于指定發(fā)生錯(cuò)誤時(shí)的回調(diào)函數(shù)

finally()：finally()方法用于指定不管 Promise 對(duì)象最后狀態(tài)如何，都會(huì)執(zhí)行的操作

4箱锐、構(gòu)造函數(shù)方法：Promise構(gòu)造函數(shù)存在以下方法

all()：Promise.all()方法用于將多個(gè) Promise實(shí)例比勉，包裝成一個(gè)新的 Promise實(shí)例

race()：Promise.race()方法同樣是將多個(gè) Promise 實(shí)例，包裝成一個(gè)新的 Promise 實(shí)

allSettled()：Promise.allSettled()方法接受一組 Promise 實(shí)例作為參數(shù)驹止，包裝成一個(gè)新的 Promise 實(shí)例

resolve()：將現(xiàn)有對(duì)象轉(zhuǎn)為 Promise對(duì)象

reject()：Promise.reject(reason)方法也會(huì)返回一個(gè)新的 Promise 實(shí)例浩聋，該實(shí)例的狀態(tài)為rejected

五、使用場景

將圖片的加載寫成一個(gè)Promise臊恋，一旦加載完成衣洁，Promise的狀態(tài)就發(fā)生變化

通過鏈?zhǔn)讲僮鳎瑢⒍鄠€(gè)渲染數(shù)據(jù)分別給個(gè)then捞镰，讓其各司其職闸与。或當(dāng)下個(gè)異步請(qǐng)求依賴上個(gè)請(qǐng)求結(jié)果的時(shí)候岸售，我們也能夠通過鏈?zhǔn)讲僮饔押媒鉀Q問題

通過all()實(shí)現(xiàn)多個(gè)請(qǐng)求合并在一起践樱，匯總所有請(qǐng)求結(jié)果，只需設(shè)置一個(gè)loading即可

通過race可以設(shè)置圖片請(qǐng)求超時(shí)

7.Generator

一凸丸、定義

1拷邢、Generator 函數(shù)是 ES6 提供的一種異步編程解決方案，語法行為與傳統(tǒng)函數(shù)完全不同

2屎慢、執(zhí)行 Generator 函數(shù)會(huì)返回一個(gè)遍歷器對(duì)象瞭稼，可以依次遍歷 Generator 函數(shù)內(nèi)部的每一個(gè)狀態(tài)

二、特征

1腻惠、function關(guān)鍵字與函數(shù)名之間有一個(gè)星號(hào)

2环肘、函數(shù)體內(nèi)部使用yield表達(dá)式，定義不同的內(nèi)部狀態(tài)

三集灌、異步解決方案

1悔雹、回調(diào)函數(shù)：所謂回調(diào)函數(shù)，就是把任務(wù)的第二段單獨(dú)寫在一個(gè)函數(shù)里面欣喧，等到重新執(zhí)行這個(gè)任務(wù)的時(shí)候腌零，再調(diào)用這個(gè)函數(shù)

2、Promise：Promise就是為了解決回調(diào)地獄而產(chǎn)生的唆阿，將回調(diào)函數(shù)的嵌套益涧，改成鏈?zhǔn)秸{(diào)用

3、generator：yield表達(dá)式可以暫停函數(shù)執(zhí)行驯鳖，next方法用于恢復(fù)函數(shù)執(zhí)行闲询，這使得Generator函數(shù)非常適合將異步任務(wù)同步化

4久免、async/await：將上面Generator函數(shù)改成async/await形式，更為簡潔嘹裂，語義化更強(qiáng)了

5妄壶、區(qū)別：

promise和async/await是專門用于處理異步操作的

Generator并不是為異步而設(shè)計(jì)出來的，它還有其他功能（對(duì)象迭代寄狼、控制輸出丁寄、部署Interator接口...）

promise編寫代碼相比Generator、async更為復(fù)雜化泊愧，且可讀性也稍差

Generator伊磺、async需要與promise對(duì)象搭配處理異步情況

async實(shí)質(zhì)是Generator的語法糖，相當(dāng)于會(huì)自動(dòng)執(zhí)行Generator函數(shù)

async使用上更為簡潔删咱，將異步代碼以同步的形式進(jìn)行編寫屑埋，是處理異步編程的最終方案

8.Proxy

一、定義

用于定義基本操作的自定義行為

二痰滋、本質(zhì)

1摘能、修改的是程序默認(rèn)形為，就形同于在編程語言層面上做修改敲街，屬于元編程(meta programming)

2团搞、Proxy 亦是如此，用于創(chuàng)建一個(gè)對(duì)象的代理多艇，從而實(shí)現(xiàn)基本操作的攔截和自定義（如屬性查找逻恐、賦值、枚舉峻黍、函數(shù)調(diào)用等）

三复隆、用法

1、Proxy為 構(gòu)造函數(shù)姆涩，用來生成 Proxy實(shí)例

var proxy = new Proxy(target, handler)

2挽拂、參數(shù)：

target表示所要攔截的目標(biāo)對(duì)象（任何類型的對(duì)象，包括原生數(shù)組骨饿，函數(shù)轻局，甚至另一個(gè)代理））

handler通常以函數(shù)作為屬性的對(duì)象，各屬性中的函數(shù)分別定義了在執(zhí)行各種操作時(shí)代理 p 的行為

四样刷、使用場景

1、Proxy其功能非常類似于設(shè)計(jì)模式中的代理模式览爵，常用功能如下：

攔截和監(jiān)視外部對(duì)對(duì)象的訪問

降低函數(shù)或類的復(fù)雜度

在復(fù)雜操作前對(duì)操作進(jìn)行校驗(yàn)或?qū)λ栀Y源進(jìn)行管理

2置鼻、使用 Proxy 保障數(shù)據(jù)類型的準(zhǔn)確性：

聲明了一個(gè)私有的 apiKey，便于 api 這個(gè)對(duì)象內(nèi)部的方法調(diào)用蜓竹，但不希望從外部也能夠訪問 api._apiKey

3箕母、觀察者模式（Observer mode）指的是函數(shù)自動(dòng)觀察數(shù)據(jù)對(duì)象储藐，一旦對(duì)象有變化，函數(shù)就會(huì)自動(dòng)執(zhí)行：

observable函數(shù)返回一個(gè)原始對(duì)象的 Proxy代理嘶是，攔截賦值操作钙勃，觸發(fā)充當(dāng)觀察者的各個(gè)函數(shù)

4、觀察者函數(shù)都放進(jìn)Set集合聂喇，當(dāng)修改obj的值辖源，在會(huì)set函數(shù)中攔截，自動(dòng)執(zhí)行Set所有的觀察者

9.Module

一希太、定義

1克饶、模塊：

是能夠單獨(dú)命名并獨(dú)立地完成一定功能的程序語句的集合（即程序代碼和數(shù)據(jù)結(jié)構(gòu)的集合體）

2、原因：

變量和方法不容易維護(hù)誊辉，容易污染全局作用域

加載資源的方式通過script標(biāo)簽從上到下矾湃。

依賴的環(huán)境主觀邏輯偏重，代碼較多就會(huì)比較復(fù)雜堕澄。

大型項(xiàng)目資源難以維護(hù)邀跃，特別是多人合作的情況下，資源的引入會(huì)讓人奔潰

二蛙紫、方案

1拍屑、CommonJs（典型代表：node.js早期）：

它通過 require 來引入模塊，通過 module.exports 定義模塊的輸出接口

這種模塊加載方案是服務(wù)器端的解決方案惊来，它是以同步的方式來引入模塊的

因?yàn)樵诜?wù)端文件都存儲(chǔ)在本地磁盤丽涩，所以讀取非常快裁蚁，所以以同步的方式加載沒有問題

但如果是在瀏覽器端矢渊，由于模塊的加載是使用網(wǎng)絡(luò)請(qǐng)求，因此使用異步加載的方式更加合適

2枉证、AMD（典型代表：require.js）：

這種方案采用異步加載的方式來加載模塊矮男，模塊的加載不影響后面語句的執(zhí)行

所有依賴這個(gè)模塊的語句都定義在一個(gè)回調(diào)函數(shù)里，等到加載完成后再執(zhí)行回調(diào)函數(shù)室谚。require.js 實(shí)現(xiàn)了 AMD 規(guī)范

3毡鉴、CMD（典型代表：sea.js）：

這種方案和 AMD 方案都是為了解決異步模塊加載的問題，sea.js 實(shí)現(xiàn)了 CMD 規(guī)范

它和require.js的區(qū)別在于模塊定義時(shí)對(duì)依賴的處理不同和對(duì)依賴模塊的執(zhí)行時(shí)機(jī)的處理不同

4秒赤、ES6 Module：

ES6 提出的方案猪瞬，使用 import 和 export 的形式來導(dǎo)入導(dǎo)出模塊

10.Decorator

一、定義

1入篮、Decorator陈瘦，即裝飾器，從名字上很容易讓我們聯(lián)想到裝飾者模式：

簡單來講潮售，裝飾者模式就是一種在不改變?cè)惡褪褂美^承的情況下痊项，動(dòng)態(tài)地?cái)U(kuò)展對(duì)象功能的設(shè)計(jì)理論

2锅风、ES6中Decorator功能亦如此，其本質(zhì)也不是什么高大上的結(jié)構(gòu)鞍泉，就是一個(gè)普通的函數(shù)皱埠，用于擴(kuò)展類屬性和類方法：

代碼可讀性變強(qiáng)了，裝飾器命名相當(dāng)于一個(gè)注釋

在不改變?cè)写a情況下咖驮，對(duì)原來功能進(jìn)行擴(kuò)展

二边器、用法

1、類的裝飾：當(dāng)對(duì)類本身進(jìn)行裝飾的時(shí)候游沿，能夠接受一個(gè)參數(shù)饰抒，即類本身

2、類屬性的裝飾：當(dāng)對(duì)類屬性進(jìn)行裝飾的時(shí)候诀黍，能夠接受三個(gè)參數(shù)

類的原型對(duì)象

需要裝飾的屬性名

裝飾屬性名的描述對(duì)象

3袋坑、注意：裝飾器不能用于修飾函數(shù)，因?yàn)楹瘮?shù)存在變量聲明情況

三眯勾、使用場景

1枣宫、基于Decorator強(qiáng)大的作用，我們能夠完成各種場景的需求吃环，下面簡單列舉幾種

2也颤、使用react-redux的時(shí)候，如果寫成下面這種形式郁轻，既不雅觀也很麻煩：

class MyReactComponent extends React.Component {}

export default connect(mapStateToProps, mapDispatchToProps)(MyReactComponent);

3翅娶、通過裝飾器就變得簡潔多了：

@connect(mapStateToProps, mapDispatchToProps)

export default class MyReactComponent extends React.Component {}

4、將mixins好唯，也可以寫成裝飾器竭沫，讓使用更為簡潔了：

function mixins(...list) {

? return function (target) {

? ? Object.assign(target.prototype, ...list);

? };

}

// 使用

const Foo = {

? foo() { console.log('foo') }

};

@mixins(Foo)

class MyClass {}

let obj = new MyClass();

obj.foo() // "foo"

文鏈接：https://blog.csdn.net/qq_56966124/article/details/124264185