JS高级程序设计精简版（第十一章：期约与异步）附思维导图

        时隔两年后二刷JavaScript高级程序语言，纯手打读书笔记+思维导图，让自己有一个比较全面的知识体系，后面有遇到例子的时候会慢慢补充更多的用法。有不足之处欢迎大家评论区指出，共勉！！

第十一章 期约与异步

一、异步

1. 同步与异步

同步：所有指令都是在单个线程中按顺序执行的

异步：为了不阻塞线程，可以将计算量大或要等很长时间的操作使用异步。

ES5异步：以往只支持回调函数来表明异步操作完成，因此很经常串联多个异步操作（回调地狱）

二、期约ES6

期约：ES6新增的引用类型Promise，期约用来抽象的表示一个异步操作

var promise = new Promise(function(resolve, reject) { // 异步处理 // 处理结束后、调用resolve 或 reject });

1、期约状态

1)期约状态机

待定pending：异步代码尚未开始或正在执行

兑现resolved：已经完成执行

拒绝rejected：没有完成

2)控制期约状态

期约的状态是私有的，只能通过调用两个函数参数（resolve()和reject()）切换状态，无论哪个被调用状态都不可撤销了。

2、期约实例方法

1）Promise.prototype.then(onResolved(){//期约进入兑现状态时执行},onRejected(){})

then()方法会返回一个新Promise实例，具体如下：

将then方法中，第一个onResolved中的返回值或第二个onRejected的返回值，都是通过Promise.resolve()包装成一个新预期再返回，而这个方法会保留返回的期约，若此函数中抛出异常，则会返回拒绝的预期。

onResolved()中的参数，是定义promise中,调用resolve(值)的值传入。

2）Promise.prototype.catch(onRejected(){})只处理拒绝预期，他其实是一个语法糖。

Promise.prototype.then(null,onRejected(){})的语法糖

异步错误只能通过这样捕获，而不能通过throw/catch在外部捕获（这是同步代码）

1. Promise.prototype.finally()方法

无论状态是resolved还是rejected都会执行，在这里一般定义与状态无关的代码。

这个方法返回的新期约实例，一般是父期约的传递，但在finally()方法中返回一个待定期约或抛出错误（throw或返回一个拒绝期约），则返回相应的期约。

以上三个方法中的函数都是异步执行的。

3、期约类方法

1）直接实例化期约状态

Promise.resolve()

可以通过执行器函数将期约转为以上两种落定状态，也可以通过Promise.resolve()实例化一个解决的期约，可以将传入的参数包装成一个解决的期约类型。

Promise.reject()可以实例化一个拒绝的期约并抛出一个异步错误（不能被try/catch捕获）

2）期约连锁与期约合成：

①期约连锁：链式调用，每个后续的处理程序都会等待前一个期约解决，然后实例化一个新期约并返回它。

②期约合成：将多个期约合成为一个期约

Promise.all([])：可迭代对象中的元素会通过Promise.resolve()转为期约，此方法会在每个期约都解决之后才解决（全resolved则合成期约的解决值就是所有包含期约解决值的数组），若有一个无状态或拒绝，则会返回第一个对应的状态期约（但依旧会执行所有期约）。

Promise.race([])：返回最先解决或拒绝的期约镜像。

③串行期约

可以链式调用多个期约，可以通过以下方法进行简写。

function addTen(x) {

return [addTwo, addThree, addFive]

.reduce((promise, fn) => promise.then(fn), Promise.resolve(x)); //resolve作为初始值

}

4、期约扩展

——ES6不支持但通过封装可以实现的功能

①取消期约：期约正在处理但程序已经不再需要其结果，最好能取消期约，但ES6只要期约逻辑开始执行就无法阻止。

②期约进度通知：ES6不支持进度跟踪

三、异步函数

1、async/await语法糖简化异步代码

async关键字用于声明异步函数，让函数具有异步特征，但函数有返回值时会通过Promise.resolve()包装成一个期约对象。若async关键词函数里没有await，与普通函数无异。

await可以暂停异步函数后面的代码的执行，让出JS运行时的执行线程（类似于yield）。

await后面跟实现thenalbe接口对象的时候，会进行“解包”。若后面接会throw错误的同步操作，则会返回拒绝的期约。

2、异步函数拓展：简化串行执行期约

for (const fn of [addTwo, addThree, addFive]) {

x = await fn(x);

}