Javascript的地狱回调:

2024-02-29 03:59
文章标签 java script 回调 地狱

本文主要是介绍Javascript的地狱回调:,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

前言

本文由@rccoder投稿分享。作者总结了四种方式来进行异步操作。

 

正文从这开始~

 

1. 讲个笑话

 

JavaScript 是一门编程语言

 

2. 异步编程

 

JavaScript 由于某种原因是被设计为单线程的,同时由于 JavaScript 在设计之初是用于浏览器的 GUI 编程,这也就需要线程不能进行阻塞。

 

所以在后续的发展过程中基本都采用异步非阻塞的编程模式。

 

简单来说,异步编程就是在执行一个指令之后不是马上得到结果,而是继续执行后面的指令,等到特定的事件触发后,才得到结果。

 

也正是因为这样,我们常常会说: JavaScript 是由事件驱动的。

 

3. 异步实现

 

用 JavaScript 构建一个应用的时候经常会遇到异步编程,不管是 Node 服务端还是 Web 前端。

 

那如何去进行异步编程呢?就目前的标准以及草案来看,主要有下面的几种方式:

  • 回调

  • promise

  • Generator

  • await/async

 

3.1 回调

 

这种异步的方式是最基础的实现,如果你曾经写过一点的 Node, 可能经常会遇到这样的代码:

640?wx_fmt=jpeg&tp=webp&wxfrom=5&wx_lazy=1

 

如此,connection.query() 是一个异步的操作,我们在调用他的时候,不会马上得到结果,而是会继续执行后面的代码。这样,如果我们需要在查到结果之后才做某些事情的话,就需要把相关的代码写在回调里面,如果涉及到多个这样的异步操作,就势必会陷入到回调地狱中去。

 

这种回调地狱不仅看起来很不舒服,可读性比较差;除此之外还有比较重要的一点就是对异常的捕获无法支持。

 

3.2 Promise

 

Promise 是 ES 2015 原生支持的,他把原来嵌套的回调改为了级联的方式。

 

一般着,我们对一个 Promise 可以这样写:

640?wx_fmt=jpeg&tp=webp&wxfrom=5&wx_lazy=1

 

如果要涉及到多个异步操作的顺序执行问题,我们可以这样写:

640?wx_fmt=jpeg&tp=webp&wxfrom=5&wx_lazy=1

 

也可以把函数抽离出来

640?wx_fmt=jpeg&tp=webp&wxfrom=5&wx_lazy=1

 

我们只需要 return 一个 Promise 即可实现这种多个异步操作的顺序执行。

 

粗略来看,这是一个比较优雅的异步解决方案了,并且在 Promise 中我们也可以实现分级的 catch。

 

但对于之前接触过其他语言的同学来说还是比较别扭的。那能否用同步的方式来书写异步呢?

 

3.3 Generator

 

在 ES 2015 中,出现了 Generator 的语法,熟悉 Python 的同学肯定对这种语法有点了解。

 

简单来说,Generator 可以理解为一个可以遍历的状态机,调用 next 就可以切换到下一个状态。

 

在 JavaScript 中,Generator 的 function 与 函数名之间有一个 *, 函数内部使用 yield 关键词,定义不同的状态。

 

先看一段代码:

640?wx_fmt=jpeg&tp=webp&wxfrom=5&wx_lazy=1

 

上面的这段代码是借助 TJ 的 co 实现的,依照约定,co 中 yield 后面只能跟 Thunk 或者 Promise.

 

co 的实现代码很短,简单来说大体是这样:

640?wx_fmt=jpeg&tp=webp&wxfrom=5&wx_lazy=1

 

简单来说就是一直借助 generator 的 next 进行迭代,直到完成这个异步操作才返回。当前人家官方的 co 是 200 行代码,支持异步操作的并行:

640?wx_fmt=jpeg&tp=webp&wxfrom=5&wx_lazy=1

 

但如果我们使用 co,强迫症们就会觉得这不是标准的写法,有点 hack 小子的感觉。

 

幸运的是,在 ES 2016 的草案中,终于提出了标准的写法。

 

3.4 await/async

 

这是在 ES 2016 中引入的新关键词,这将在语言层面彻底解决 JavaScript 的异步回调问题,目前可以借助 babel 在生产环境中使用。使用 await/async 可以让异步的操作以同步的方式来写。

 

使用方法和 co 非常类似,同时也支持同步写法的异常捕获。

640?wx_fmt=jpeg&tp=webp&wxfrom=5&wx_lazy=1

 

如果上述的代码完全用 Promise 实现,极有可能是下面的代码:

640?wx_fmt=jpeg&tp=webp&wxfrom=5&wx_lazy=1

 

相比较来说,await/async 解决了完全使用 Promise 的一个极大痛点——不同Promise之间共享数据问题:

 

Promise 需要设定外层数据开始共享,这样就需要在每个then里面进行赋值,而 await/async 就不存在这样的问题,只需要以同步的方式去写就可以了。

 

await/async 对异常的支持也是特别好的:

640?wx_fmt=jpeg&tp=webp&wxfrom=5&wx_lazy=1

参考文献

  • 回调地狱 @ 奇舞团博客

  • ES6 Generator介绍 @ 腾讯全端 AlloyTeam 团队 Blog

  • 使用Generator解决回调地狱 @ 腾讯全端 AlloyTeam 团队 Blog

  • 「大概可能也许是」目前最好的 JavaScript 异步方案 async/await @ LearnClound

 

关于本文

作者:@rccoder

原文:https://github.com/rccoder/blog/issues/17

转载于:https://my.oschina.net/duozuo/blog/800293

这篇关于Javascript的地狱回调:的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/757521

相关文章

Java编译生成多个.class文件的原理和作用

《Java编译生成多个.class文件的原理和作用》作为一名经验丰富的开发者,在Java项目中执行编译后,可能会发现一个.java源文件有时会产生多个.class文件,从技术实现层面详细剖析这一现象... 目录一、内部类机制与.class文件生成成员内部类(常规内部类)局部内部类(方法内部类)匿名内部类二、

SpringBoot实现数据库读写分离的3种方法小结

《SpringBoot实现数据库读写分离的3种方法小结》为了提高系统的读写性能和可用性,读写分离是一种经典的数据库架构模式,在SpringBoot应用中,有多种方式可以实现数据库读写分离,本文将介绍三... 目录一、数据库读写分离概述二、方案一:基于AbstractRoutingDataSource实现动态

Springboot @Autowired和@Resource的区别解析

《Springboot@Autowired和@Resource的区别解析》@Resource是JDK提供的注解,只是Spring在实现上提供了这个注解的功能支持,本文给大家介绍Springboot@... 目录【一】定义【1】@Autowired【2】@Resource【二】区别【1】包含的属性不同【2】@

springboot循环依赖问题案例代码及解决办法

《springboot循环依赖问题案例代码及解决办法》在SpringBoot中,如果两个或多个Bean之间存在循环依赖(即BeanA依赖BeanB,而BeanB又依赖BeanA),会导致Spring的... 目录1. 什么是循环依赖?2. 循环依赖的场景案例3. 解决循环依赖的常见方法方法 1:使用 @La

Java枚举类实现Key-Value映射的多种实现方式

《Java枚举类实现Key-Value映射的多种实现方式》在Java开发中,枚举(Enum)是一种特殊的类,本文将详细介绍Java枚举类实现key-value映射的多种方式,有需要的小伙伴可以根据需要... 目录前言一、基础实现方式1.1 为枚举添加属性和构造方法二、http://www.cppcns.co

Elasticsearch 在 Java 中的使用教程

《Elasticsearch在Java中的使用教程》Elasticsearch是一个分布式搜索和分析引擎,基于ApacheLucene构建,能够实现实时数据的存储、搜索、和分析,它广泛应用于全文... 目录1. Elasticsearch 简介2. 环境准备2.1 安装 Elasticsearch2.2 J

Java中的String.valueOf()和toString()方法区别小结

《Java中的String.valueOf()和toString()方法区别小结》字符串操作是开发者日常编程任务中不可或缺的一部分,转换为字符串是一种常见需求,其中最常见的就是String.value... 目录String.valueOf()方法方法定义方法实现使用示例使用场景toString()方法方法

Java中List的contains()方法的使用小结

《Java中List的contains()方法的使用小结》List的contains()方法用于检查列表中是否包含指定的元素,借助equals()方法进行判断,下面就来介绍Java中List的c... 目录详细展开1. 方法签名2. 工作原理3. 使用示例4. 注意事项总结结论:List 的 contain

Java实现文件图片的预览和下载功能

《Java实现文件图片的预览和下载功能》这篇文章主要为大家详细介绍了如何使用Java实现文件图片的预览和下载功能,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下... Java实现文件(图片)的预览和下载 @ApiOperation("访问文件") @GetMapping("

Spring Boot + MyBatis Plus 高效开发实战从入门到进阶优化(推荐)

《SpringBoot+MyBatisPlus高效开发实战从入门到进阶优化(推荐)》本文将详细介绍SpringBoot+MyBatisPlus的完整开发流程,并深入剖析分页查询、批量操作、动... 目录Spring Boot + MyBATis Plus 高效开发实战:从入门到进阶优化1. MyBatis