async/await 简单理解

async/await能够更适合与promise协同工作，实现异步功能。

0x00 async

async 关键词 声明在一个函数前，此函数将会返回一个 Promise。

如果代码中有 return <非promise> 语句，JavaScript 会自动把返回的这个 value 包装成 promise 的 resolved 值。

/**
Promise.resolve(value);
Promise.resolve(promise);
Promise.resolve(thenable);
*/
Promise.resolve('foo');//等价于如下
new Promise((resolve)=>{
    resolve('foo');
})

async function f(){
    return 1;
}
f().then(alert)

async 确保函数返回一个 promise！

---

0x01 await

await 只能在 async 标识函数的内部使用

async function f() {
    let promise = new Promise((resolve, reject) => {
        setTimeout(() => resolve("done!"), 1000)
    });

    let result = await promise; // wait till the promise resolves (*)

    alert(result); // "done!"
}
f();

这个程序运行的时候，会在 let result = await promise的语句处，会停下来，直到
promise 返回一个值（1秒后），await 使得 js 执行等待，直到 promise 处理完成，然后将结果继续下去。

promise 前的 await关键词能够使得 js 等待，直到 promise 处理结束。

换句话说， await 只会等待 Promise 的异步

---

0x02 错误处理

promise 正常 resolve，await 正常返回结果，在 reject 情况下会抛出一个错误，类似throw

promise 在 reject 抛出错误需要一段时间，await 会等待，因此使用 try{...} catch(err){...} 捕获语句错误。

async function f() {
    try {
        let response = await fetch('http://www.test.com/api/')
    } catch (err) {
        alet(err) // TypeError: failed to fetch
    }
}
f()

当然也可以 .catch()，常用第一种方法

async function f() {
    let response = await fetch('http://www.test.com/api/')
}
// f()变成了一个rejected的promise
f().catch(alert) // TypeError: failed to fetch

---

如此写异步就像同步代码一样，也避免了回调地狱。

Reference： https://javascript.info/async-await