写点什么

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:42747

评论

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

Shopify 跨境电商的对接开发指南

北京木奇科技有限公司

APP开发 跨境电商 软件外包公司

当开源技术遇上能源管理:MyEMS 为何成为企业降本增效 “新选择”?

开源能源管理系统

开源 能源管理系统

从设备监控到全局调控,MyEMS 如何构建 “全链路” 能源管理体系?

开源能源管理系统

开源 开源能源管理系统

开工不累,双强护航:文心快码接入 DeepSeek-V3.2-Exp和 GLM-4.6,助你节后高效Coding

Comate编码助手

编程模型 Baidu Comate comate AI 编程 文心快码

【RFID工具包怎么选】适合铁路检修和电力巡检的品牌有哪些?

斯科信息

RFID技术 RFID工具包

和鲸科技参编《气象数据智能处理与分析平台建设指南》,推动气象+AI 深度融合

ModelWhale

人工智能 AI 气象 气象智能体 气象+AI

双喜临门!矩阵起源荣膺全国总决赛季军并获多家资本青睐

MatrixOrigin

矩阵起源 多模态数据 粤港澳大湾区创业大赛 AI数据智能平台

2025年9月文章一览

codists

编程人

AI 英语写作 App的开发

北京木奇科技有限公司

软件外包公司 AI英语学习 AI英语听力

APP 高效开发指南:解锁正确打开的底层方法

xuyinyin

深入解析YashanDB的核心架构与性能优势

数据库砖家

【隐私计算科普】如何实现可证明安全?

隐语SecretFlow

“你好BOE”再度携非遗与当代设计亮相米兰 以科技之力向世界展现东方美学

爱极客侠

Docker入门实践:从零开始掌握容器技术

qife122

Docker DevOps

在AI技术唾手可得的时代,挖掘开发者工具新需求成为关键突破点

qife122

需求分析 AI开发

MyEMS:深挖能耗数据,解锁降本与碳管双重 “密码”

开源能源管理系统

开源 开源能源管理系统

pyLDAPGui开发历程:跨平台LDAP图形化工具诞生记

qife122

ldap GUI开发

移动端动态化建设的演进与实践 技术革新驱动下的生态繁荣

xuyinyin

深耕商品计划26年,客户这样评价第七在线

第七在线

深入解析YashanDB的架构设计与功能特色

数据库砖家

未雨绸缪,以长期思维赢未来 ——光大永明光明至尊A款终身寿险

北京中暄互动广告传媒有限公司

摆地摊摆摊小程序:助力地摊经济高效运营的实用工具

微擎应用市场

农场小程序管理系统:吸粉与流量变现解决方案

微擎应用市场

海外App 的上线和运营

北京木奇科技有限公司

APP开发 软件外包公司 海外APP

RFID盘点通道机哪家好?每秒识别千件的通道机有哪些厂家能做?

斯科信息

斯科信息 RFID技术 RFID通道机 RFID盘点通道机

AI 英语口语 App 的开发流程

北京木奇科技有限公司

APP开发 APP外包 AI英语学习

当舆情监测遇上跨文化挑战:海外社交媒体监控的破局与深耕

沃观Wovision

社交媒体 海外舆情监控 沃观Wovision 舆情监测系统

MES如何实现高效排产?其生产计划功能与底层技术架构

万界星空科技

数字化转型 mes 万界星空科技mes AI智能化MES

海外社交媒体监控之于现代舆情监测的意义:数据洪流下的精准捕获

沃观Wovision

社交媒体 沃观Wovision 舆情监测系统 海外舆情监测

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