一次性让你懂async/await

简介: 一次性让你懂async/await

async 函数是 Generator 函数的语法糖。使用 关键字 async 来表示,在函数内部使用 await 来表示异步。相较于 Generator,async 函数的改进在于下面四点:


内置执行器。Generator 函数的执行必须依靠执行器,而 async 函数自带执行器,调用方式跟普通函数的调用一样

更好的语义。async 和 await 相较于 * 和 yield 更加语义化

更广的适用性。co 模块约定,yield 命令后面只能是 Thunk 函数或 Promise对象。而 async 函数的 await 命令后面则可以是 Promise 或者 原始类型的值(Number,string,boolean,但这时等同于同步操作)

返回值是 Promise。async 函数返回值是 Promise 对象,比 Generator 函数返回的 Iterator 对象方便,可以直接使用 then() 方法进行调用


怎么用?

async function asyncFn() {
  return 'hello world';
}
asyncFn();
 

async 表示函数里有异步操作

await 表示紧跟在后面的表达式需要等待结果。

async function asyncFn() {
    return '我后执行'
}
asyncFn().then(result => {
    console.log(result);
})
console.log('我先执行');

上面的执行结果是先打印出'我先执行',虽然是上面asyncFn()先执行,但是已经被定义异步函数了,不会影响后续函数的执行。


现在理解了async基本的使用,那还有什么特性呢?


async定义的函数内部会默认返回一个promise对象,如果函数内部抛出异常或者是返回reject,都会使函数的promise状态为失败reject。

async function e() {    
    throw new Error('has Error');
}
e().then(success => console.log('成功', success))   
   .catch(error => console.log('失败', error));

我们看到函数内部抛出了一个异常,返回rejectasync函数接收到之后,判定执行失败进入catch,该返回的错误打印了出来。

async function throwStatus() {    
    return '可以返回所有类型的值'
}
throwStatus().then(success => console.log('成功', success))             
             .catch(error => console.log('失败', error));
 
//打印结果
 
成功 可以返回所有类型的值
async`函数接收到返回的值,发现不是`异常`或者`reject`,则判定成功,这里可以`return`各种数据类型的值,`false`,`NaN`,`undefined`...总之,都是`resolve


相关文章
|
7月前
|
前端开发
async和await 优雅处理异步
async和await 优雅处理异步
|
JSON 前端开发 JavaScript
async/await的应用
async/await的应用
66 0
|
7月前
|
前端开发
Await和Async是什么?跟Promise有什么区别 使用它有什么好处
Await和Async是什么?跟Promise有什么区别 使用它有什么好处
|
1月前
|
前端开发 JavaScript
async/await和Promise在性能上有什么区别?
性能优化是一个综合性的工作,除了考虑异步模式的选择外,还需要关注代码的优化、资源的合理利用等方面。
38 4
|
1月前
|
前端开发
如何使用async/await解决Promise的缺点?
总的来说,`async/await` 是对 Promise 的一种很好的补充和扩展,它为我们提供了更高效、更易读、更易维护的异步编程方式。通过合理地运用 `async/await`,我们可以更好地解决 Promise 的一些缺点,提升异步代码的质量和开发效率。
35 5
|
2月前
|
前端开发 JavaScript
Async/Await 如何通过同步的方式(形式)实现异步
Async/Await 是一种在 JavaScript 中以同步方式书写异步代码的语法糖。它基于 Promise,使异步操作看起来更像顺序执行,简化了回调地狱,提高了代码可读性和维护性。
|
7月前
|
前端开发 JavaScript 开发者
阿珊带你深入理解 async/await 函数
阿珊带你深入理解 async/await 函数
|
4月前
|
C#
C# async await 异步执行方法
C# async await 异步执行方法
56 0
|
4月前
|
前端开发 JavaScript
如何在forEach内使用异步调用 async/await
如何在forEach内使用异步调用 async/await
|
7月前
|
监控 前端开发 JavaScript
等一下!深入async/await的异步世界
等一下!深入async/await的异步世界
105 1
下一篇
DataWorks