async + await 优雅处理异步

开发的时候偶尔遇到回调地狱的问题

function ajax(fn) {
    setTimeout(() => {
        console.log('你好')
        fn()
    }, 1000)
}

ajax(() => {
    console.log('执行结束')
    ajax(() => {
        ajax(() => {
            ajax(() => {
                //.....
            })
        })
        console.log('hhhhhhh')
    })
})

没完没了的回调，会导致阅读困难，并且捕获异常也是非常麻烦的。这个时候就出现了使用 Promise

function delay (word) {
    return new Promise((reslove, reject) => {
        setTimeout(() => {
            reslove(word)
        }, 2000)
    })
}

delay('hhhhhh').then((res) => {
    console.log(res)
    return delay('aaaaaa')
}).then((res) => {
    console.log(res)
    return delay('jjjjj')
}).then((res) => {
    console.log(res)
})

Promise 可以理解成承诺的意思， （我承诺，当我成功的时候，执行 reslove 函数, 当我失败的时候，我执行 reject 函数）
如果可以用同步的写法，来解决异步的问题，会让人看着更加舒服

function delay (word) {
    return new Promise((reslove, reject) => {
        setTimeout(() => {
            reslove(word)
        }, 2000)
    })
}

async function start () {
    const res1 = await delay('hhhh')
    console.log(res1)
    const res2 = await delay('aaaaa')
    console.log(res2)
    const res3 = await delay('jjjj')
    console.log(res3)
}

start()

使用 await 则函数要使用 async 来声明。async 声明的函数里面，没有 await
（等我执行完 delay 这个函数，再往下执行）