手把手教你一步步写一个Promise(下)

手把手教你一步步写一个Promise(下)

前言

相信大家看完-->手写Promsie的上篇 下篇的内容就是小菜一碟了。

让我们一起来快速复习和实现一下Promise的那些方法吧!

Promise.prototype.catch方法

catch()方法返回一个Promise,并且处理拒绝的情况。 ——MDN

所以可以通过then方法的第二个参数来模拟catch方法,代码如下

Promise.prototype.catch = function (catchFunc) {
    return this.then(null, catchFunc)
}
复制代码

Promise.resolve()

Promise.resolve(value)方法返回一个以给定值解析后的Promise对象 ——MDN

代码如下

Promise.resolve = function (value) {
    return new Promise((resolve, reject) => {
        resolve(value)
    })
}
复制代码

Promise.reject()

Promise.reject()方法返回一个带有拒绝原因的Promise对象 ——MDN

代码和resolve方法类似,如下

Promise.reject = function (value) {
    return new Promise((resolve, reject)=>{
        reject(value)
    })
}
复制代码

Promise.prototype.finally方法

finally()方法返回一个Promise在promise结束时,无论结果是fulfilled或者是rejected,都会执行指定的回调函数。这为在Promise是否成功完成后都需要执行的代码提供了一种方式。 ——MDN

由于无法知道promise的最终状态,所以finally的回调函数中不接收任何参数,它仅用于无论最终结果如何都要执行的情况。 代码如下

Promise.prototype.finally = function (func) {
    return this.then((value) => {
        return Promise.resolve(func()).then(() => {
            return value;
        });
    }, (err) => {
        return Promise.resolve(func()).then(() => {
            throw err;
        });
    });
}
复制代码

Promise.all()

Promise.all(iterable) 方法返回一Promise 实例,此实例在 iterable 参数内所有的 promise 都“完成(resolved)”或参数中不包含 promise 时回调完成(resolve);如果参数中 promise 有一个失败(rejected),此实例回调失败(reject),失败的原因是第一个失败 promise 的结果。 ——MDN

Promise.all返回一个Promise实例,该实例将会在promiseArray中的所有Promise实例被决议后进行决议,决议结果是一个数组。

Promise.all = function (promiseArray) {
    //如果promiseArray为非数组,则抛出一个错误
    if (!Array.isArray(promiseArray)) {
        throw new TypeError('The arguments should be an array!')

    }
    return new Promise((resolve, reject) => {
        try {
            let resultArray = []
            const length = promiseArray.length
            for (let i = 0; i < length; i++) {
                promiseArray[i].then(
                    data => {
                        resultArray.push(data)
                        if (resultArray.length === length) {
                            resolve(resultArray)
                        }
                    }

                    , reject)

            }

        } catch (e) {
            reject(e)
        }
    })
}
复制代码

Promise.race()

Promise.race(iterable) 方法返回一个 promise,一旦迭代器中的某个promise解决或拒绝,返回的 promise就会解决或拒绝。 ——MDN

for循环同步执行promsieArray数组中所有Promise实例的then方法,第一个resolve的实例会直接触发新的Promise实例的resolve方法。

Promise.race = function(promiseArray){
    //如果promiseArray为非数组,则抛出一个错误
    if(!Array.isArray(promiseArray)){
        throw new TypeError('The arguments is should be an array')
    }
    return new Promise((resolve,reject)=>{
        try {
            const length = promiseArray.length
            for(let i =0;i<length;i++){
                promiseArray[i].then(resolve,reject)
            }
        } catch (e) {
            reject(e)
        }
    })
}
复制代码

总结

相信大家看完上下两篇手写Promise的文章,对Promise有一个更加深刻的理解和认识,遇到手写Promise的题目也能有优雅的完成。

如果大家有什么建议和想法也欢迎在评论区讨论

结尾福利

快点击这个链接--->阿里云云开发平台发福利啦,部署你的第一个k8s应用<---

无需一行代码,5分钟一键部署上线WordPress, 2000件阿里云帽衫等你领

免费领取阿里云帽衫活动期间(11月26号~12月5号)成功部署WordPress博客后即可领取阿里云帽衫

分类:
前端
标签: