一、await for 的基本用法
await for是异步编程的一种方式，可以更优雅地处理回调函数的繁琐。
通过在async函数中使用await关键词对异步操作进行等待，从而令程序的执行顺序变得更加清晰可读。
基本语法示例：
async function someFunc() {
const result = await someAsyncOperation();
console.log(result);
}二、await for 和 Promise的关系
await for的底层依赖是Promise，可以说是Promise的语法糖，只不过更加友好地将异步操作封装了一下。实际上，在使用await for的过程中，会自动生成一个Promise对象。
上一段代码可以重写为：
function someFunc() {
someAsyncOperation().then((result) => {
console.log(result);
}).catch((err) => {
console.error(err);
});
}从语法上看，await for更加直观易懂，且不需要繁琐的错误处理（使用try-catch即可）。
三、await for 的限制
虽然使用await for可以使异步操作更加优雅，但要注意一些限制：
1、await只能在async函数中使用。
2、await只能等待Promise对象。
3、如果一个async函数中有多个await，那么它们将按照顺序依次执行。
如果第一个await操作在执行过程中发生错误，则会直接跳转到对应的catch语句中。
示例代码：
async function someFunc() {
try {
const result1 = await someAsyncOperation1();
console.log(result1);
const result2 = await someAsyncOperation2();
console.log(result2);
} catch(err) {
console.error(err);
}
}四、await for vs callback
在JavaScript早期版本中，回调函数是处理异步调用的常用方式。
示例代码：
function someFunc(cb) {
someAsyncOperation((err, result) => {
if(err) {
console.error(err);
} else {
console.log(result);
}
if(cb) {
cb(err, result);
}
});
}显然，使用回调函数的代码可读性较差，写法繁琐。而使用await for可以让代码写法更加直观友好。
五、await for vs promise
Promise是ES6中新增的处理异步操作的方式。
示例代码：
function someFunc() {
someAsyncOperation().then((result) => {
console.log(result);
}).catch((err) => {
console.error(err);
});
}虽然Promise可以优化代码结构，但是在使用await for的时候，可以大大简化代码结构，让代码变得更加直观。
总结
await for是ES8中新增的语法糖，是处理异步操作的一种方式。通过在async函数中使用await关键词进行等待，让异步操作看起来更加直观友好。在使用过程中，要注意一些限制，如：只能在async函数中使用，只能等待Promise对象等。
原创文章，作者：CWQB，如若转载，请注明出处：https://www.506064.com/n/149069.html
微信扫一扫 
支付宝扫一扫 