美文网首页
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

    浅谈Async/Await用 async/await 来处理异步 async和await async:声明一个异步...

  • ES8(一) —— async&await

    目录 async和普通函数的区别 await async/await处理多回调异步 async和await必须配合...

  • ES6中的好东西

    1 Await/Async 前端的回调时代我没有赶上,我赶上的是await/async时代。await和async...

  • 使用 async 和 await,实现 fetch 同步请求

    使用 async 和 await,实现 fetch 同步请求 关于 async 和 await 的介绍https:...

  • ES2017 async 函数

    async 和 await 在干什么 每个名称都有意义async : 异步await: async wait简...

  • async-await

    一、async-await和Promise的关系 async-await是promise和generator的语法...

  • 小程序-云开发

    async和await async:异步(无等待)await:等待(是为了同步) 一、await 关键字只在 as...

  • async / await

    async / await 优缺点 async 和 await 相比直接使用 Promise 来说,优势在于处理 ...

  • flutter中compute和isolate

    async和await:对于普通的任务,使用async和await可实现异步处理任务,而async的处理方式并非使...

  • Promise 执行顺序

    使用 async 和 await

网友评论

      本文标题:async和await

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