async await 初步学习

最近项目涉及到一个需求，两个异步请求，第二个请求需要等到第一个异步请求里的数据返回后才能发送，于是这里初步用到了async / await 。现在记录下

async/await 语法可以更舒适的与promise协同工作。

async 被放置在一个函数的前面（函数前面的async一词意味着这个函数总是返回一个promise，如果代码中有return <非promise>语句，JavaScript会自动把返回的这个value值包装成promise的resolved值。）

async function f() {
　　return 1

}

console.log(32,f()) //返回的是一个Promise对象

 关键词await可以让JavaScript进行等待，直到一个promise执行并返回它的结果，JavaScript才会继续往下执行。

// 只能在async函数内部使用
let value = await promise

async function f() {
    let promise = new Promise((resolve, reject) => {
        setTimeout(() => resolve('done!'), 1000)
    })
    let result = await promise // 直到promise返回一个resolve值（*）
    alert(result) // 'done!' 
}
f()

await 字面上使得JavaScript等待，直到promise处理完成，

这里再加入一个新用上的知识点  try / catch 

如果一个promise正常resolve，那么 await 返回这个结果，但是在reject的情况下会抛出一个错误，就好像在那一行有一个throw语句一样。

在真实的使用场景中，promise在reject抛出错误之前可能需要一段时间，所以 await 将会等待，然后才抛出一个错误。
我们可以使用try-catch语句捕获错误，就像在正常抛出中处理异常一样：

async function f() {
    try {
        let response = await fetch('http://no-such-url')
    } catch (err) {
        alet(err) // TypeError: failed to fetch
    }
}
f()

如果我们不使用try-catch，然后async函数f()的调用产生的promise变成reject状态的话，我们可以添加.catch去处理它：

async function f() {
    let response = await fetch('http://no-such-url')
}
// f()变成了一个rejected的promise
f().catch(alert) // TypeError: failed to fetch

放在一个函数前的async有两个作用：
1.使函数总是返回一个promise
2.允许在这其中使用await

promise前面的await关键字能够使JavaScript等待，直到promise处理结束。然后：

1.如果它是一个错误，异常就产生了，就像在那个地方调用了throw error一样。
2.否则，它会返回一个结果，我们可以将它分配给一个值

该资源来自于https://segmentfault.com/a/1190000013292562?utm_source=channel-newest