封装 Promise 函数

Promise 函数在 react 中是比较常用的，函数看着挺高大上的，那么这个函数到底是怎么实现的，了解这点对 Promise 的应用会更加熟悉。

我们一起来看看。

promise 一般作为函数的 return 返回，使用 then 进行调用。下面接收 promise 发回来的结果。

function fun(){
        return new Promise((resolve,reject)=>{
            resolve("我是Promise")
        })
    }
    fun().then(res=>console.log(res));

Promise 返回结果

先来研究下 Promise 的执行机制，表面上来看是 resolve 执行了，then 里面的函数。then 才能打印出来结果，但是如果我们不写 then ，resolve 这个函数的执行是没有任何意义的，写了 then 函数才执行并打印出来结果。所以逻辑上肯定是 then 去调用 resolve 的。

现在封装：

class fun {
        constructor(resolve){
            console.log(resolve);
        }
        then(res){
            console.log(res);
        }
    }
    function read(){
        return new fun((resolve)=>{
            resolve("看到我你就成功接收了数据！")
        });
    }
    read().then((res)=>console.log(res));

上面返回两个函数，我们只需要考虑的就是，res 和 resolve 这两个函数如何进行通信。

class fun {
        constructor(resolve){
            console.log(resolve);
            this.fn = resolve;
        }
        then(res){
            console.log(res);
            this.fn(res);
        }
    }
    function read(){
        return new fun((resolve)=>{
            resolve("看到我你就成功接收了数据！")
        });
    }
    read().then((res)=>console.log(res));

接收成功