自定义Promise(一)-- Promise构造函数

发布日期:2021-08-02 阅读量:892

1、定义Promise构造函数

   1)需要一个参数executor(执行器函数,同步执行)模拟 new Promise((resolve, reject)=>{}) 红字部分

   2)需要定义3个属性

       (1)status 存储执行状态 ('pending', 'resolved', 'rejected')

       (2)data 存储结果数据 (value,reason)

       (3)callbacks 存储回调函数集 (结构为:{ onResolved(){}, onRejected(){} } )

   3)执行器函数中的resolve函数作用:

       (1)改变Promise状态为:resolved,(状态只能是pending时才可以改变)

       (2)保存结果数据

       (3)执行回调函数onResolved,将结果数据传递

   4)执行器函数中的reject函数作用:

       (1)改变Promise状态为rejected,(状态只能是pending时才可以改变)

       (2)保存结果数据

       (3)执行回调函数onRejected,将失败结果传递

   5)当抛出异常执行reject函数:(模拟 new Promise((resolve, reject) => { throw new Error() }))

       (1)捕获异常

       (2)调用reject

     /**
     * Promise 构造函数
     * @param executor 执行器函数
     */
     function Promise(executor) {
        var self = this; // 防止this指向出错
        self.status = 'pending'; // promise的状态属性,初始值为 pending
        self.data = undefined; // promise用于存储结果数据的属性
        self.callbacks = []; // 回调函数存储,结构为:{ onResolved(){}, onRejected(){} }
        /**
         * 
         * @param value 
         */
        function resolve(value) {
            // 如果当前状态不是pending, 直接结束(状态只能改变一次)
            if (self.status !== 'pending') {
                return;
            }
            // 改变状态
            self.status = 'resolved'
            // 保存value 数据
            self.data = value
            // 如果有待执行的callback函数,立即异步执行回调函数
            if (self.callbacks.length > 0) {
                setTimeout(() => { // 模拟异步回调
                    self.callbacks.forEach(cbObj => {
                        cbObj.onResolved(value)
                    });
                })
            }
        }
        function reject(reason) {
            // 如果当前状态不是pending, 直接结束(状态只能改变一次)
            if (self.status !== 'pending') {
                return;
            }
            // 改变状态
            self.status = 'rejected'
            // 保存value 数据
            self.data = reason
            // 如果有待执行的callback函数,立即异步执行回调函数
            if (self.callbacks.length > 0) {
                setTimeout(() => { // 模拟异步回调
                    self.callbacks.forEach(cbObj => {
                        cbObj.onRejected(reason)
                    });
                })
            }
        }
        try { // 捕获异常
            // 立即同步执行executor
            execeutor(resolve, reject);
        } catch (error) {
            reject(error);
        }
        
     }