promise - 4.源码实现实现

    技术2023-09-21  103

    promise

    Promise 天生是一个类,类中需要传入一个 executor 执行器,默认会立即执行promise 内部会提供两个方法,可以更改 promise 的状态promise 总共有三种状态 (等待态 成功态 失败态) 3-1. resolve 触发成功 3-2. reject 触发失败promise 一旦成功就不会走失败,反之同理promise 中实现链式调用主要靠返回一个新的 promise const PENDING = 'PENDING' const RESOLVED = 'RESOLVED' const REJECTED = 'REJECTED' function resolvePromise(promise2, x, resolve, reject) { // 1. 不能引用同一个对象 if(promise2 == x) { return reject(new TypeError('类型错误')) } // 2. 判断 x 的类型 let called; // 屏蔽多次调用 if((typeof x === 'object' && x != null) || typeof x === 'function') { // 有可能是 promise try { let then = x.then if(typeof then === 'function') { then.call(x, (y) => { // 当前promise 解析出来的结果可能还是一个 promise ,需要继续解析直到他是一个普通值为止 if(called) return called = true resolvePromise(promise2, y, resolve, reject) // 递归解析 resolve 的值 }, (r) => { if(called) return called = true reject(r) }) } else { resolve(x) } } catch (e) { if(called) return called = true reject(e) } } else { resolve(x) } } class Promise { constructor(executor) { this.state = PENDING // 默认状态 this.value = undefined // 默认成功的原因 this.reason = undefined // 默认失败的原因 this.onResolvedCallbakcs = [] // 专门存放成功的回调函数 this.onRejectedCallbacks = [] // 专门存放失败的回调函数 // 保证只有状态是 PENDING 的时候才能更改状态 let resolve = (value) => { if(this.state == PENDING) { this.state = RESOLVED this.value = value // 需要让成功的方法依次执行 this.onResolvedCallbakcs.forEach(fn => fn()) } } let reject = (reason) => { if(this.state == PENDING) { this.state = REJECTED this.reason = reason // 让失败的方法依次执行 this.onRejectedCallbacks.forEach(fn => fn()) } } try { executor(resolve, reject) // 立即执行 } catch (e) { reject(e) // 如果内部出错直接将 err 手动的调用 reject } } catch(errCallback) { // catch 就是没有成功的 then 方法 return this.then(null, errCallback) } then(onfulfilled, onrejected) { onfulfilled = typeof onfulfilled == 'function' ? onfulfilled : v => v onrejected = typeof onrejected == 'function' ? onrejected : err => { throw err } let promise2 = new Promise((resolve, reject) => { if(this.state == RESOLVED) { setTimeout(() => { try { let x = onfulfilled(this.value) resolvePromise(promise2, x, resolve, reject) } catch (e) { reject(e) } }, 0); } if(this.state == REJECTED) { setTimeout(() => { try { let x = onrejected(this.reason) resolvePromise(promise2, x, resolve, reject) } catch (e) { reject(e) } }, 0); } if(this.state == PENDING) { // 如果走这里,说明 executor 内存在异步逻辑,且 promise 可以多次 .then this.onResolvedCallbakcs.push(() => { // TODO... 切片编程 setTimeout(() => { try { let x = onfulfilled(this.value) resolvePromise(promise2, x, resolve, reject) } catch (e) { reject(e) } }, 0); }) this.onRejectedCallbacks.push(() => { setTimeout(() => { try { let x = onrejected(this.reason) resolvePromise(promise2, x, resolve, reject) } catch (e) { reject(e) } }, 0); }) } }) return promise2 } } /** * 1. 测试 promise 规范的脚本 * 全局安装 npm i -g promises-aplus-tests * 根目录下执行 promises-aplus-tests promise.js */ Promise.defer = Promise.deferred = function() { let dfd = {} dfd.promise = new Promise((resolve, reject) => { dfd.resolve = resolve dfd.reject = reject }) return dfd } module.exports = Promise
    Processed: 0.014, SQL: 9