手写Promise.all原理(自己理解的,若有问题没考虑,欢迎留言)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
</body>
<script>
    //模拟异步请求
    let p1 = new Promise((resolve,reject) => {
        setTimeout(() => {
            resolve("p2 Promise模拟数据请求已返回")
        }, 1000);
    })

    //模拟异步请求
    let p2 = new Promise((resolve,reject) => {
        setTimeout(() => {
            resolve("p2 Promise模拟数据请求已返回")
        }, 2000);
    })

    console.time("cost")
    // promise all使用
    Promise.all([p1,p2]).then(res => {
        console.log(res)//每个p都有resolve返回时,才会执行promise all,res才会出来
        console.timeEnd("cost")//记录花费的时间
    })

    // 手写promsie all原理
    function allSelf(arr){
        return new Promise((resolve,reject) => {
            let resArr = []
            for(let i in arr){
                Promise.resolve(arr[i])
                    .then(res => {
                        resArr[i] = res
                        if(resArr.length == arr.length){
                            resolve(resArr)
                        }
                    }).catch(err => {
                        reject(err)
                    })
            }
        })
    }

    //调用自己手写的promise all原理
    console.time("cost")
    allSelf([p1,p2]).then(res => {
        console.log(res)
        console.timeEnd("cost")//记录花费的时间
    })
</script>
</html>


版权声明:本文为A186G原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。