用Promise封装异步过程，用async封装Promise

本文主要是介绍用Promise封装异步过程，用async封装Promise，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！

Promise实例

fetch是个典型的Promise，在当前页打开chrom控制台，输入下面的代码查看输出结果

fetch('/').then(res=>res.text()).then(data=>console.log(data.length))
复制代码

典型的异步操作

setTimeout是典型的异步函数，使用一个回调函数作为参数 这里会返回一个正整数，表示定时器的编号

setTimeout(
   function () {
       console.log('123')
   },
   1000   
)
复制代码

封装成Promise

用Math.random生成rnd 如果rnd大于0.5则resolve(rnd)，否则reject(rnd) 一个new Promise是一个立执行的函数，要有then和catch

new Promise((resolve,reject)=>{
    setTimeout(()=>{
        let rnd = Math.random()
        if(rnd > 0.5)
            resolve(rnd)
        else
            reject(rnd)
    }, 1000)
})
.then(res=>console.log('resolve=', res))
.catch(err=>console.log('reject=', err))
复制代码

把Promise封装成一个函数的返回值

只需要用普通函数封装new Promise 不立刻执行的promise，不需要then和catch，在调用的时候补充即可

let p1 = ()=> new Promise((res,rej)=>    
        setTimeout(()=>{
            let rnd = Math.random()
            if(rnd > 0.5)
                res(rnd)
            else
                rej(rnd)
        }, 1000)
    )
复制代码

用async/await封装Promsie，用同步的方式写异步

async/await 是Promise的语法糖， await 后面接的是Promise的调用， await 拿到的是resolve的数据，也就是传给then的数据， reject的数据需要try...catc， catch的err是try中所有的await的错误

let q1 = async ()=>{
    try {
        let res = await p1()
        console.log('await res=', res)
    }
    catch(err) {
        console.warn('awati rej=', err)
    }
}
复制代码

测试

async函数不带await执行，相当于同步函数

for(let i = 0; i<10; i++) {
   q1()
}
复制代码

async函数带await执行，才是同步方式写异步

for(let i = 0; i<10; i++) {
   await q1()
}
复制代码

后记： 其实，new Promise里放同步函数异步函数都可以，不过同步就没必要用Promise。 Node8 就提供了 util.promisify() 这个方法，方便我们快捷的把原来的异步回调方法改成返回 Promise 实例的方法，接下来，想继续用队列，还是 await 就看需要了。 只要符合 Node.js 的回调风格，所有函数都可以这样转换。 满足下面两个条件即可。

1. 最后一个参数是函数
2. 回调函数的参数为 (err, result)，前面是可能的错误，后面是正常的结果。

参考

www.bilibili.com/video/BV12E…

这篇关于用Promise封装异步过程，用async封装Promise的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！