Promise学习笔记

一、promise是什么？

1、promise是一门新的技术（ES6规范）。
2、promise是JS中进行异步编程的新解决方案。（旧方案是单纯使用回调函数）
3、promise的作用是支持链式调用，可以解决回调地狱问题。
（何为回调地狱？）回调地狱指回调函数嵌套调用，外部调用函数异步执行的结果是嵌套的回调执行的条件。它不便于阅读，不便于异常处理。

举个例子来说回调地狱，如下：

我们需要通过一个url1从服务器加载一个数据data1,data1中包含了下一个请求的url2；
我们需要通过data1取出url2，从服务器加载数据data2，data2中包含了下一个请求的url3；
我们需要通过data2取出url3，从服务器加载数据data3，data3中包含了下一个请求的url4；
发送网络请求url4，获取最终的数据data4。

二、promise初体验

promise有两个形参，分别是resolve和reject。它们用来修改promise的状态。resolve和reject本身又是函数。

resolve：解决 函数类型的数据
reject：拒绝 函数类型的数据

通过调用then方法，来指定promise对象成功或失败时的回调，如果成功就执行第一个回调函数，如果失败就执行第二个回调函数。

三、promise的实践练习-----fs模块

1、没有promise，采用回调函数形式

2、采用promise形式，对文件进行封装

四、promise的实践练习-----AJAX请求

现在，想做一个小demo，点击按钮后，可以给指定接口地址发送请求。
1、没有采用promise，
html中

js文件中

2、现在用promise进行封装

五、promise的实践练习-----封装一个函数mineReadFile读取文件内容

mineReadFile函数要在nodejs环境下运行，有下面两个条件

参数：path 文件路径
返回：promise 对象

调用then方法读取文件

以后想要读取文件就可以这样直接使用，而不需要在mineReadFile方法后写回调函数了，可以用后面的then方法来执行回调。

六、nodejs中内置的一个方法----promisify

util.promisify:传入一个遵循常见的错误优先的回调风格的函数，（即以（err,value）=>…回调作为最后一个参数），并返回一个返回promise的版本。

对于以后想用promise，我们不需要每一个方法都使用手动进行封装，而可以使用util.promisify方法，将原来使用回调函数风格的方法转化为promise这样的函数。

七、promise封装AJAX请求

1、封装一个sendAJAX发送GET AJAX请求
2、参数 URL

3、返回结果 Promise对象

八、promise对象状态属性介绍

1、promise对象状态：取决于实例对象中的一个属性【PromiseState】。（这个属性是内置的 ，我们不能直接对这个属性进行操作。）
PromiseState有以下取值：

pending:未决定的。等待状态，比如正在进行网络请求，或者定时器没有到时间。
resolved/fullfilled：成功。满足状态，当我们主动回调了resolve时，就处于该状态，并且会回调.then()。
rejected:失败。拒绝状态，当我们主动回调了reject时，就处于该状态，并且会回调.catch()。

只可能有以下状态的改变
pending变为resolved
pending变为rejected
说明：只有这两种，且一个promise对象只能改变一次。
无论变为成功还是失败，都会有一个结果数据
成功的结果数据一般称为vaule,失败的结果数据一般称为reason。

2、promise对象的值：取决于实例对象中的另一个属性【PromsieResult】。保存着异步任务【成功/失败】的结果。
PromsieResult有两个取值：分别是resolve，reject

九、promise的工作流程

十、Promise的API

1、Promise构造函数：Promise（executor）{}
(1)、executor函数：执行器（resolve，reject）=>{}
(2)、resolve函数：内部定义成功时我们调用的函数 value=>{}
(3)、reject函数：内部定义失败时我们调用的函数reason=>{}
说明：executor会在Promise内部立即同步调用，异步操作在执行器中执行。

2、Promise.prototype.then方法：（onResolved,onRejected）=>{}
(1)、onResolved函数：成功时的回调函数（value）=>{}
(2)、onRejected函数：失败的回调函数（reason）=>{}
说明：指定用于得到成功回调和用于得到失败reason的失败回调，返回一个新的promise对象。

3、Promise.prototype.catch方法：（onRejected）=>{}
(1)、onRejected函数：失败的回调函数（reason）=>{}
说明：只能指定失败的回调，不能指定成功的回调。

4、Promise.resolve方法：（value）=>{}
(1)、value：成功的数据或promise对象
说明：返回一个成功/失败的promise对象。

5 、Promise.reject方法：（reason）=>{}
(1)、reason：失败的原因
说明：返回一个失败的promise对象。

6、Promise.all方法：（promises）=>{}
(1)、promises:包含n个promise的数组
说明：返回一个新的promise对象，只有所有的promise都成功才成功，只要有一个失败了就直接失败。

7、Promise.race方法：（promises）=>{}
(1)、promises:包含了n个promise的数组
说明：返回一个新的promise，第一个完成的promise的结果状态就是最终的结果状态。

十一、promise的几个关键问题

1、如何改变promise的状态？
（1）resolve（value）：如果当前是pending就会变为resolved
（2）reject（reason）：如果当前是pending就会变为rejected
（3）抛出异常：如果当前是pending就会变为rejected

2、一个promise指定多个成功/失败回调函数，都会调用吗？
当promise改变为对应状态时都会调用。

3、改变promise状态和指定回调函数谁先谁后？
（1）都有可能，正常情况下是先指定回调再改变状态，但也可以先改状态再指定回调，就像下面两种情况：
第一种情况：先改变状态再执行回调

第二种情况：先指定回调再改变状态

（2）如何先改状态再指定回调？
①在执行器中直接调用resolve()/reject()
②延迟更长时间才调用then

（3）什么时候才能得到数据？
①如果先改变的状态，那当指定回调时，回调函数就会调用，得到数据。
②如果先指定的回调，那当状态发生改变时，回调函数就会调用，得到数据。

4、promise.then()返回的新promise的结果状态由什么决定？
（1）简单表达：由then()指定的回调函数执行的结果决定。
（2）详细表达：
①如果抛出异常，新promise变为rejected，reason为抛出的异常
②如果返回的是非promise的任意值，新promise变为resolved，value为返回的值
③如果返回的是另一个新promise，此promise的结果就会成为新promise的结果

5、promise如何串联多个任务

结果如下，记住then方法的返回结果也是一个promise对象

6、promise的异常穿透

十二、async与await

1、async函数
①、函数的返回值为promise对象。
②、promise对象的结果由async函数执行的返回值决定。

可以看出，async和then方法中回调的返回结果是一样的。

2、await表达式
①、await右侧的表达式一般为promise对象，但也可以是其他的值；
②、如果表达式是promise对象，await返回的是promise成功的值；
③、如果表达式是其他值，直接将此值作为await的返回值。
注意：
①、await必须写在async函数中，但async函数中可以没有await；
②、如果await的promise失败了，就会抛出异常，需要通过try…catch捕获处理。

3、async和await结合

现在想做一个功能，让1.html、2.html和3.html中的内容合并输出，
①、使用回调函数的方式

②、使用async和await

4、async和await结合发送AJAX请求

做一个小例子说明，点击按钮来发送AJAX，来获取段子的信息。

后面可以用axios来代替sendAJAX这个函数，axios是基于promise操作方式的一个AJAX封装的包，用axios就可以直接发送AJAX。