写点什么

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

评论

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

淘宝API接口与用户体验分析

联讯数据

华为云耀云服务器L实例:智能、高性能、低成本的数字化助手

轶天下事

2023-12-02:用go语言,如何求模立方根? x^3=a mod p, p是大于等于3的大质数, a是1到p-1范围的整数常数, x也是1到p-1范围的整数,求x。 p过大,x不能从1到p-1遍

福大大架构师每日一题

福大大架构师每日一题

HuggingFists-低代码玩转LLM RAG(1) Embedding

数由科技

低代码 Embedding LLM rag huggingfists

责任等同于背锅?

BY林子

Nacos配置中心脱敏

姚秋实(Nacol)

安全 nacos 架构设计 jasypt 配置中心

高防服务器一般价格多少钱一台?

Geek_f19a80

服务器

【高效视频处理】一窥火山引擎多媒体处理框架-BMF

计算机魔术师

数字化时代的利器:华为云服务器L实例助力初创企业稳健成长

平平无奇爱好科技

性能卓越,部署无忧,华为云这款产品值得信赖

平平无奇爱好科技

华为云耀云服务器L实例:专为中小企业量身打造的高性能云服务器

轶天下事

AI 与自然语言

天黑黑

大模型 LLM 提示词

ZooKeeper应用场景综述

极客罗杰

助力企业上云降本增效,华为云这款产品有妙招

轶天下事

企业数字化创新发展,华为云这款服务器助力一键飞跃数字化巅峰

轶天下事

3D模型材质编辑

3D建模设计

3D纹理 3D材质 模型渲染

CSS技巧:从高度0过渡到自动高度

南城FE

CSS 前端 动画

解锁中小企业上云智选,华为云这款服务器你值得拥有

平平无奇爱好科技

数字化浪潮下云计算如何服务?华为云这款服务器用实力说话

平平无奇爱好科技

数字化转型新篇章:华为云耀云服务器L实例引领初创与成长型企业向前

平平无奇爱好科技

华为云耀云服务器L实例:企业建站与小程序开发的绝佳选择

轶天下事

回顾2023,展望2024——小工程师的执着

工程师日月

#技术人的2023总结

传输黑科技下的全景之旅—浅谈开源项目E3PO的思路与功能

计算机魔术师

探索未来云计算,华为云耀云服务器L实例引领行业新动力

平平无奇爱好科技

MATLAB实战 | S函数的设计与应用

TiAmo

matlab

倒计时 1 天,2023 IoTDB 用户大会期待与您相见!

Apache IoTDB

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