简单实现Promise

复制代码
/**
 * 延时函数,用来模拟异步操作
 * @param {*} fun 异步函数
 * @param {*} time 延时时间
 */
const delay = (fun, time = 0) => {
    setTimeout(fun, time);
};
/**
 * 构造函数
 * @param {*} fun 传入的实例函数
 */
function MyPromise(fun) {
    // 存储promise的处理函数resolve的集合
    this.resolveFuns = [];
    /**
     * 处理函数resolve,异步
     * @param {*} data
     */
    const resolve = data => {
        delay(() => {
            // 挂载data到实例
            this.data = data;
            // 执行resolve集合函数
            this.resolveFuns.forEach(fun => fun(data));
        });
    };
    // 执行传入函数, 并将处理函数resolve当作参数传入
    fun(resolve);
}
/**
 * 链式调用
 * @param {*} onResolved then传入的函数
 * @returns 新的MyPromise对象
 */
MyPromise.prototype.then = function (onResolved) {
    // 返回新的MyPromise实例
    return new MyPromise(resolve => {
        // 存储新的resolve到resolveFuns回调函数集
        this.resolveFuns.push(() => {
            const result = onResolved(this.data);
            //  如果是新的MyPromise 就继续执行then,如果是普通值 就直接resolve
            if (result instanceof MyPromise) {
                result.then(resolve);
            } else {
                resolve(result);
            }
        });
    });
};
// 实例
new MyPromise(resolve => {
    delay(() => {
        const data = {
            msg: 'sucess',
            data: (new Date().getTime() + ' ').slice(-5, -1)
        };
        resolve(data);
    }, 300);
})
    .then(result => {
        console.log(result.data, 'MyPromise1');
        // 必须return 新的MyPromise
        return new MyPromise(resolve => {
            delay(() => {
                const data = {
                    msg: 'sucess',
                    data: (new Date().getTime() + ' ').slice(-5, -1)
                };
                resolve(data);
            }, 300);
        });
    })
    .then(result => console.log(result.data, 'MyPromise2'));
复制代码

 

posted @   流~星~泪  阅读(52)  评论(0编辑  收藏  举报
编辑推荐:
· DeepSeek 解答了困扰我五年的技术问题
· 为什么说在企业级应用开发中,后端往往是效率杀手?
· 用 C# 插值字符串处理器写一个 sscanf
· Java 中堆内存和栈内存上的数据分布和特点
· 开发中对象命名的一点思考
阅读排行:
· DeepSeek 解答了困扰我五年的技术问题。时代确实变了!
· PPT革命!DeepSeek+Kimi=N小时工作5分钟完成?
· What?废柴, 还在本地部署DeepSeek吗?Are you kidding?
· 赶AI大潮:在VSCode中使用DeepSeek及近百种模型的极简方法
· DeepSeek企业级部署实战指南:从服务器选型到Dify私有化落地
点击右上角即可分享
微信分享提示