写点什么

Javascript 之 async 四重奏(三)

  • 2019-12-31
  • 本文字数:1072 字

    阅读完需:约 4 分钟

Javascript之async四重奏(三)

async-await 的兼容并包

async 函数

在 es7 中引入的 async 函数使得处理异步操作更加方便:


直接在普通函数前面加上 async,表示这是一个异步函数,在要异步执行的语句前面加上 await,表示后面的表达式需要等待。我们通过下面的例子先简单了解一下:


(注:左右/上下滑动屏幕可查看全部代码)


function timeout(ms) { return new Promise((resolve) => {   setTimeout(resolve, ms); });}async function asyncPrint(value, ms) { await timeout(ms); console.log(value);}asyncPrint('hello world', 50);
复制代码


上面的代码指定 50 毫秒后输出 hello world


async 函数有多种使用方式:


// 函数声明式:


async function foo() {}


// 函数表达式:


const foo = async function () {}


// 对象的方法:


let obj = {async foo() {}}


obj.foo().then()


// 箭头函数:


const foo = async () => {}


async 函数返回一个 promise 对象,可以使用 then 方法添加回调函数:


(注:左右/上下滑动屏幕可查看全部代码)


async function f() {return 'hello world';}f().then(v => console.log(v))// "hello world"
复制代码


Await 命令后面是一个 promise 对象,如果不是会被转成一个立即 resolve 的 promise 对象:


(注:左右/上下滑动屏幕可查看全部代码)


async function f() {return await 123;}f().then(v => console.log(v))// 123
复制代码


通过 async 函数来发送多个请求:


(注:左右/上下滑动屏幕可查看全部代码)


async function dbFuc(db) {let docs = ['/posts.json', '/gets.json', '/puts.json'];let promises = docs.map((doc) => db.post(doc));let results = await Promise.all(promises);console.log(results);}
复制代码


由此可见,async 函数不仅包含了 promise、generator,代码也更加简洁。


总的来说,async 函数就是 generator 函数的语法糖,相对于 generator 函数 async 函数有以下优点:


  1. 有内置执行器,不用调用 next

  2. Generator 函数是需要调用 next 指令来运行异步的语句,async 不需要调用 next,直接像运行正常的函数那样运行就可以

  3. 有更好的语义化

  4. 语义化更明确,相比较于 Generator 的*和 yield,async 和 await 更明确。

  5. await 后面可以跟 promise 或者任意类型的值

  6. yield 命令后面只能是 Thunk 函数或 Promise 对象,而 async 函数的 await 命令后面,可以是 Promise 对象和原始类型的值(数值、字符串和布尔值,但这时等同于同步操作)。

  7. 返回一个 promise 对象,可以调用.then

  8. async 直接返回一个 promise 对象,可以用 then 和 catch 来处理。


本文转载自 Think 体验设计公众号。


原文链接:https://mp.weixin.qq.com/s/QgC2OjVF4pvltte9V_gkIQ


2019-12-31 15:42672

评论

发布
暂无评论
发现更多内容

IDEA的Docker插件实战(Docker-compose篇)

爱好编程进阶

Java 面试 后端开发

Java之Java特点

爱好编程进阶

Java 面试 后端开发

Java基础 - Eclipse,API,Object常用方法

爱好编程进阶

Java 面试 后端开发

Java面试题总结(附答案)

爱好编程进阶

Java 面试 后端开发

elasticsearch实战三部曲之三:搜索操作

爱好编程进阶

Java 面试 后端开发

GitHub上最火的SpringCloud微服务商城系统项目,附全套教程

爱好编程进阶

Java 面试 后端开发

Meetup回顾|星策社区FeatureStore Meetup V2

星策开源社区

机器学习 Meetup Feature Store 特征平台 MLOps

Java Shutdown Hook 场景使用和源码分析

爱好编程进阶

Java 面试 后端开发

Java8的这些集合骚操作,你掌握了嘛?

爱好编程进阶

Java 面试 后端开发

Java中高级核心知识全面解析——常用框架(Spring中-Bean-的作用域与生命周期)

爱好编程进阶

Java 面试 后端开发

蕉下招股书里提了26次的DTC,到底是啥?

易观分析

DTC

确定还不来看看?这样管理你的代码库既方便又省心!

Jianmu

开源 持续集成 工作流 代码管理 workflow

数字化赋能塑化产业,B2B电商模式引领企业增长新引擎

数商云

产业互联网 数字化转型

极致体验,揭秘抖音背后的音视频技术

字节跳动视频云技术团队

音视频开发 视频云

JavaOOP面试题50题(含答案)

爱好编程进阶

Java 面试 后端开发

InfoQ 公开课开放报名,融云场景化低代码平台探究

融云 RongCloud

银行应构建主动式客户体验管理体系,助力客户价值增长

易观分析

银行 客户体验管理

GX Works2、MX OPC 6

爱好编程进阶

Java 面试 后端开发

在Redis中使用Pipelining提升查询速度

CRMEB

啃论文俱乐部的团队之道和成长之路

PaperResearch

开源 OpenHarmony 啃论文俱乐部 技术自由

Java-进阶:Java-File-&-IO—1

爱好编程进阶

Java 面试 后端开发

【二级等保】二级等保需要做日志审计吗?

行云管家

等保 日志审计 等保2.0 二级等保

GitHub榜首的阿里“绝巅版”工程师面试手册

爱好编程进阶

Java 面试 后端开发

Java并发之Condition详解

爱好编程进阶

Java 面试 后端开发

Java流程控制语句-分支结构(选择结构)

爱好编程进阶

Java 面试 后端开发

Java基础知识点总结

爱好编程进阶

Java 面试 后端开发

JDK、JRE、JIT

爱好编程进阶

Java 面试 后端开发

FTP指的是什么协议?由什么组成?有什么作用?

行云管家

运维 网络协议 服务器 ftp

Java中IO字符流、File类

爱好编程进阶

Java 面试 后端开发

Java树结构实际应用(平衡二叉树-AVL树)

爱好编程进阶

Java 面试 后端开发

Go能实现AOP吗?

捉虫大师

Java Go aop 4月月更

Javascript之async四重奏(三)_语言 & 开发_Think体验设计_InfoQ精选文章