作用: Promise 对象,可以将异步操作以同步操作的流程表达出来,避免了层层嵌套的回调函数。此外,Promise 对象提供统一的接口,使得控制异步操作更加容易。
基本结构
Promise对象内部存在三种状态
- Pending (等待态)
- Resolved (成功态)
- Rejected (失败态)
Promise 必须接收一个执行函数(executor)带有两个函数参数(resolved,rejected)
resolve:包裹成功执行成功数据,改变 Promise 状态
reject:失败状态
解决思路_
由于异步代码的结果需要通过回调函数获取,基于结果的其他业务逻辑
就需要卸载回调函数中,所以产生的回调地狱,如果异步代码的执行结果
可以在外部拿到,此时基于结果的其他业务逻辑代码就不需要写在业务逻辑
中了,所以promise所做的事情就是通过语法的方式,让异步代码的结果可以在
外部拿到,此时基于结果的其他业务逻辑就不需要写在回调函数中了,
就避免了回调函数嵌套的问题
_
基本实现
class Promise {constructor(executor) {// 参数检验if (typeof executor !== 'function') {throw new TypeError(`Promise resolver ${executor} is a not funtion`);}this.value = null; //终值this.reason = null; //拒因this.state = 'pending'; //状态// 定义resolve函数function resolve(value) {// 成功后的一系列操作(状态的改变,成功回调的执行)if (this.status === 'pending') {this.status = 'fulfilled';this.value = value;}}// 定义reject函数function reject(reason) {// 失败后的一系列操作(状态改变,失败回调的执行)if (this.status === 'pending') {this.status = 'rejected';this.reason = reason; //拒因}}// 使用 try...catch... 捕捉代码执行过程中可能抛出的异常try {// 执行器默认会立即执行executor(resolve, reject);} catch (e) {// 如果执行时发生错误(包括手动抛出的异常),等同于执行失败reject(e);}}}Promise.prototype.then = function (onFufiled, onRejected) {let self = this;if (self.status === 'resolved') {onFufiled(self.value);}if (self.status === 'rejected') {onRejected(self.reason);}};
Promise.all和Promise.race
Promise.all
需要同时返回多个请求的数据时
Promise.race

