美文网首页
async和await

async和await

作者: 马建阳 | 来源:发表于2018-08-03 17:02 被阅读16次

    用的promise比较多,但是感觉每次.then很麻烦,有没有更好的异步处理方法呢?有的,es8出了async和await。
    我们来实现一个功能来看一下promise和async,await和之间的区别。
    功能:我们需要异步获取三个数据,获取了前面的数据才能去获取后面的数据,最后需要打印出它们的和。

    用promise实现

    function ajax(num){
        return new Promise(function(resolve,reject){
            setTimeout(()=>{
                resolve(num)
            },1000)
        })
    }
    let result=0
    ajax(1).then(data => {
        result += data
        return ajax(2)
    }).then(data => {
        result += data
        return ajax(3)
    }).then(data => {
        result += data
        console.log(result)
    }).catch(err => {
        console.log(err)
    })
    

    有没有感觉一直.then有点傻,我们来看看async和await如何实现

    用async和await实现

    function ajax(num){
        return new Promise(function(resolve,reject){
            setTimeout(()=>{
                resolve(num)
            },1000)
        })
    }
    async function test(){
        try {
            let a = await ajax(1)
            let b = await ajax(2)
            let c = await ajax(3)
            let result = a+b+c
            console.log(result) 
        }catch(err){
            console.log(err)
        }
        
    }
    console.log(test())
    

    有没有一种真正的用同步在写异步代码的感觉,等待一个异步代码执行完毕后再执行之后的代码。
    当然test()后面也可以接.then,.catch来进行处理数据

    test().then(()=>{})
          .catch(()=>{})
    

    相关文章

      网友评论

          本文标题:async和await

          本文链接:https://www.haomeiwen.com/subject/smquvftx.html