写点什么

Javascript 之 async 四重奏(二)

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

    阅读完需:约 3 分钟

Javascript之async四重奏(二)

Promise 的实例

通过 Promise 实现一个 ajax:


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


const getJSON = function(url) { const promise = new Promise(function(resolve, reject){   const handler = function() {     if (this.readyState !== 4) {       return;     }     if (this.status === 200) {       resolve(this.response);     } else {       reject(new Error(this.statusText));     }   };   const client = new XMLHttpRequest();   client.open("GET", url);   client.onreadystatechange = handler;   client.responseType = "json";   client.setRequestHeader("Accept", "application/json");   client.send(); 
});
return promise;};
getJSON("/posts.json").then(function(json) { console.log('Contents: ' + json);}, function(error) { console.error('Error:', error);});
复制代码


在上面的例子中我们看到的是 Promise.prototype.then()方法的使用,还有其他的方法:



虽然 Promise 有着非常灵活的使用方式,但是仍不免存在一些缺点:


无法中途取消 Promise、无法直接从外部知道 Promise 抛出的错误、无法具体了解 pending 状态中的阶段。而 Promise 的这些问题却在我们的下一个话题—generator 中得到了解决。


Generator 的顺势而为

Generator 函数

Generator 函数是 ES6 提供的一种异步编程解决方案。


语法上,可以把它理解成:Generator 函数是一个状态机,封装了多个内部状态。形式上,Generator 函数是一个普通函数。整个 Generator 函数就是一个封装的异步任务,或者说是异步任务的容器,异步操作需要暂停的地方,都用 yield 语句。


Generator 函数有两个特征:


(1)function 关键字和函数之间有一个星号(*),且内部使用 yield 表达式,定义不同的内部状态。


(2)调用 Generator 函数后,该函数并不执行,返回的也不是函数运行结果,而是一个指向内部状态的指针对象。


执行 Generator 函数会返回一个遍历器对象,可以依次遍历函数内部的每一个状态。这个遍历器对象有三个方法:next()、throw()、return().


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


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


2019-12-31 15:42552

评论

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

zookeeper的watch机制

大数据技术指南

大数据 zookeeper 3月日更

Docker 教程(1)---Docker简介与安装

AlbertYang

Docker

搭建博客可能会用到的 Git 命令|学习笔记

彭宏豪95

学习 极客时间 笔记

有道技术岗大揭秘!这么幸福的生活,真的是熬夜掉发Top1的职业吗?

有道技术团队

招聘

Flink 执行引擎:流批一体的融合之路

Apache Flink

flink

APICloud多端开发 | 在线教育App模板源码讲解

YonBuilder低代码开发平台

软件开发 在线教育 移动开发 APP开发 APICloud

实习就参与“服务过亿用户的项目”,是什么体验?

阿里巴巴云原生

开发者 云原生 调度 应用服务中间件 Go 语言

Flink VS Spark

五分钟学大数据

flink spark 3月日更

身份认证之多因素身份认证(MFA)

龙归科技

第三方登录 统一身份认证

NodeJS基础入门教程(1)-一文让你快速了解什么是NodeJS

AlbertYang

nodejs

大咖云集!阿里达摩院领航大数据 + AI向量检索专场Meetup回顾(内含讲师PPT领取)

Proxima 技术社区

人工智能 大数据 阿里巴巴 搜索 向量检索

定义结构体访问结构成员的三种方法

Emotion

报名倒计时 | 有道技术沙龙,聊聊明星语音背后的故事

有道技术团队

活动

行业资讯 | Android WebView 致安卓应用闪退,mPaaS 助你规避这波 Bug

蚂蚁集团移动开发平台 mPaaS

android webview mPaaS 离线包 UC内核

一周信创舆情观察(3.15~3.21)

统小信uos

阿里P9在Github上分享的Java面试突击手册,凭借它,我拿下了阿里P7的offer!

Java架构之路

Java 程序员 架构 面试 编程语言

Hystrix 实战经验分享

vivo互联网技术

Java 服务器 熔断 Hystrix

「 视频云大赛 — 大咖驾到 」驱动下一代技术浪潮,我们更专注价值落地

阿里云CloudImagine

阿里云 音视频 视频处理

我在阿里实习做开源

阿里巴巴云原生

阿里巴巴 云原生 dubbo 个人提升 中间件

Go Mysql Driver 集成 Seata-Golang 解决分布式事务问题

阿里巴巴云原生

Java 微服务 云原生 seata Go 语言

vue+typescript实现组件封装之button篇

小小

typescript Vue

面试字节跳动定级2-2,拿32*16offer,P8大佬的面试教程给了我春天!

Java架构之路

Java 程序员 架构 面试 编程语言

字节金三银四Java面试题库被泄露,GitHub连夜被下架

Java架构师迁哥

百度直播消息服务架构实践

百度Geek说

手机 直播 移动端

什么样的技术能进入一线大厂?这份阿里、百度、腾讯等 20家Java岗招聘要求梳理报告,会给你答案;

Java架构之路

Java 程序员 架构 面试 编程语言

C 语言性能优化:循环条件i<=n与i!=0的性能差异

1

Go Storage存储包封装

非晓为骁

storage Go 语言

全文检索工具包Lucene入门教程

AlbertYang

lucene

UDTS上线数据集成服务,汇聚多源数据帮助企业高效分析决策

UCloud技术

数据传输 数据集成

活动 | Apache Pulsar Meetup 欢迎报名

有道技术团队

活动

从无到有实现音视频通讯

anyRTC开发者

ios android 音视频 WebRTC RTC

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