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