forked from qianguyihao/Web
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
b7fba92
commit 204cbe4
Showing
5 changed files
with
263 additions
and
233 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,66 @@ | ||
|
||
> 备注: async/await 的内容还有待完善。 | ||
## async/await (异步函数)概述 | ||
|
||
async/await 是在 ES7 中引入的新语法,可以更加方便地进行异步操作。 | ||
|
||
本质: Generator 的语法糖。 | ||
|
||
- async 的返回值是 Promise 实例对象。 | ||
|
||
- await 可以得到异步结果。 | ||
|
||
我们在普通的函数前面加上 async 关键字,就成了 async 函数。 | ||
|
||
## async/await 的基本用法 | ||
|
||
async 后面可以跟一个 Promise 实例对象。代码举例如下: | ||
|
||
```javascript | ||
const request1 = function() { | ||
const promise = new Promise(resolve => { | ||
request('https://www.baidu.com', function(response) { | ||
if (response.retCode == 200) { | ||
// 这里的 response 是接口1的返回结果 | ||
resolve('request1 success'+ response); | ||
} else { | ||
reject('接口请求失败'); | ||
} | ||
}); | ||
}); | ||
|
||
return promise; | ||
}; | ||
|
||
async function queryData() { | ||
const response = await request1(); | ||
}); | ||
return response; | ||
} | ||
queryData().then(data => { | ||
console.log(data); | ||
}); | ||
|
||
``` | ||
|
||
|
||
## 基于 async/await 处理多次 Ajax 请求【重要】 | ||
|
||
实际开发中,现在有三个网络请求,请求2必须依赖请求1的结果,请求3必须依赖请求2的结果,如果按照往常的写法,会有三层回调,会陷入“回调地狱”。 | ||
|
||
这种场景其实就是接口的多层嵌套调用。之前学过 Promise,它可以把原本的**多层嵌套调用**改进为**链式调用**。 | ||
|
||
而今天要学习的 async/await ,可以把原本的“多层嵌套调用”改成类似于同步的写法,非常优雅。 | ||
|
||
代码举例: | ||
|
||
暂略。 | ||
|
||
|
||
## 参考链接 | ||
|
||
- [js async await 终极异步解决方案](https://www.cnblogs.com/CandyManPing/p/9384104.html) | ||
|
||
- [理解 JavaScript 的 async/await](https://segmentfault.com/a/1190000007535316) | ||
|
Oops, something went wrong.