promise

Promise

• promise是ES6引入的异步编程的新的解决方案，从语法上来说，它是一个构造函数，可以实例化对象，封装异步操作，获取成功和失败的结果，其优点是支持链式调用可以解决回调地狱问题指定回调函数的方式更为灵活

1.准备

• promise是ES6引入的进行异步编程的新的解决方案，从语法上来说，它就是一个构造函数，可以封装异步的任务，并且可以对结果进行处理，promise最大的好处在于可以解决回调地狱的问题，并且它在指定回调与进行错误处理这块要更加的灵活与方便，而且promise在现代的项目当中无论是web还是app的项目当中都应用的十分广泛，无论是前端还是后端都可以看到promise的身影。

异步编程

• fs文件操作
• 数据库操作
• AJAX
• 定时器

2.Proise介绍与基本使用

2.1 Promise 是什么？

2.1.1 理解

1. 抽象表达

• Pormise 是一门新的技术(ES6规范)
• Promise 是JS中进行异步编程的新的解决方案
• 备注：旧方案是单纯使用回调函数

2. 具体表达

• 从语法上来说：Promise是一个构造函数
• 从功能上来说：Promise对象用来封装一个异步操作并可以获取其中成功/失败的结果

2.1.2 Promise 的状态改变

• 实例对象中的一个属性 [PromiseState]
  • pending 未决定的
  • resolved/fullfilled 成功
  • rejected 失败
• 实例对象中的另一个值 [PromiseResult]
  • 保存着对象异步任务成功/失败的结果

1. pending 变为resolved
2. pending 变为rejected

• 说明：只有这两种，且一个promise对象只能改变一次，无论变为成功还是失败，都会有一个结果数据，成功的结果一般称为value，失败的结果一般称为reason

2.1.3 Promise的基本流程

• new Promise()[pending状态]
• 执行异步操作
  • 成功了，执行resovle()
    • promise对象[resolved状态]
    • 回调onResolved()[then]
    • 新的promise对象
  • 失败了，执行reject()
    • promise对象[rejected状态]
    • 回调onRejected()[then()/catch()]
• 新的Promise对象

2.2 为什么要用Promise?

2.2.1 指定回调函数的方式更加灵活

1. 旧的：必须在启动异步任务前指定
2. promise：启动异步任务=>返回Promise对象=>给Promise对象绑定回调函数(甚至可以在异步任务结束后指定/多个)

2.2.2 支持链式调用，可以解决回调地狱问题

1. 什么是回调地狱

• 回调函数嵌，外部回调函数异步执行的结果是嵌套的回调执行的条件

2. 回调地狱的缺点

• 不便于阅读
• 不便于异常处理

3. 解决方案？

• promise链式调用

2.3 如何使用Promise?

2.3.1 API

1. Promise 构造函数：Promise(executor){}

• executor函数：执行器(resolve,reject)=>{}
• resovle函数：内部定义成功时我们调用的函数value=>{}
• reject函数：内部定义失败时我们调用的函数reson=>{}
• 说明：executor会在Promise内部立即同步调用，异步操作在执行器中执行

2. Promise.prototype.then 方法：(onResolved,onRejected)=>{}

• onResolved函数：成功的回调函数(value)=>{}
• onRejected函数：失败的回调函数(reason)=>{}
• 说明：指定用于得到成功value的成功回调和用于得到失败reason的失败回调，返回一个新的promise对象

3. Promise.prototype.catch方法：(onRejected)=>{}

• onRejected函数：失败的回调函数(reason)=>{}

4. Promise.resolve方法：(value)=>{}

• value:成功的数据或promise对象
• 说明返回一个成功/失败的promise对象

5. Promise.reject 方法：(reason)=>{}

• reason:失败的原因
• 说明：返回一个失败的promise对象

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

• promises:包含n个promise的数组
• 说明：返回一个新的promise，第一个完成的promise的结果状态就是最终的结果状态

2.3.2 promise的几个关键问题

1. 如何改变promise的状态？

• resolve(value):如果当前是pending就会变为resolved
• reject(reason):如果当前是pending就会变为rejected
• 抛出异常：如果当前是pending就会变为rejected

2. 一个promise指定多个成功/失败回调函数，都会执行吗？

• 当promise改变为对应状态时都会调用

3. 改变promise状态和指定回调函数谁先谁后？

• 都有可能，正常情况下是先指定回调再改变状态，但也可以先改变状态再指定回调
• 如何先改变状态再指定回调？
  • 在执行器中直接调用resovled()/rejected()
  • 延迟更长时间才调用then
• 什么时候才能得到数据？
  • 如果先指定的回调，那当状态发生改变时，回调函数就会调用，得到数据
  • 如果先改变的状态，那当指定回调时，回调函数就会调用，得到数据

4. Promise.then() 返回的新promise的结果状态由什么决定？

• 简单表达：由then()指定的回调函数执行的结果决定
• 详细表达：
  • 如果抛出异常，新的promise改变为rejected，reason为抛出的异常
  • 如果返回的是非promise的任意值，新Promise变为resolved，value为返回的值
  • 如果返回的是另外一个新Promise，此Promise的结果就会称为新Promise的结果

5. promise如何串连多个操作任务？

• Promise的then()返回一个新的Promise，可以形成then()的链式调用
• 通过then的链式调用串连多个同步/异步任务

6. Promise异常穿透

• 当使用promise的then链式调用时，可以在最后指定失败的回调
• 前面任何操作出了异常，都会传到最后失败的回调中处理

7. 中断promise链？

• 当使用Promse的then链式调用时，在中间中断，不再调用后面的回调函数
• 办法：在回调函数中返回一个pendding状态的Promise对象

4.async 与 await

4.2 async 函数

1. 函数的返回值为promise对象
2. promise对象的结果由async函数执行的返回值决定

4.3 await 表达式

1. await右侧的表达式一般为promise对象，但也可以是其他的值
2. 如果表达式是promise对象，await返回的是promise成功的值
3. 如果表达式是其他值，直接将此值作为await的返回值

4.4 注意

1. await必须卸载async函数中，但async函数中可以没有await
2. 如果await的promise失败了，就会抛出异常，需要通过try...cantch捕获处理