js中的回调地狱 Callback to Hell
- 什么是回调地狱?(函数作为参数层层嵌套)
- 异步的JavaScript程序,或者说使用了回调函数的JavaScript程序,很难地去直观顺畅地阅读,,就是函数作为参数层层嵌套。代码以此种形式展现时无疑是不利于我们阅读与维护的。
- 什么是回调函数?(一个函数作为参数需要依赖另一个函数执行调用)
- 回调函数是必须得依赖另一个函数执行调用,它是异步执行的,也就是需要时间等待,典型的例子就是Ajax应用,比如http请求,在不刷新浏览器的情况下,当你执行DOM事件时,比如页面上点击某链接,回车等事件操作,浏览器会悄悄向服务端发送若干http请求,携带后台可识别的参数,等待服务器响应返回数据,这个过程是异步回调的,当许多功能需要连续调用,环环相扣依赖时,它就类似下面的代码,代码全部一层一层的嵌套,看起来就很庞大,很恶心,就产生了回调地狱.
- 如何解决回调地狱
- 保持你的代码简短(给函数取有意义的名字,见名知意,而非匿名函数,写成一大坨)
- 模块化(函数封装,打包,每个功能独立,可以单独的定义一个js文件Vue,react中通过import导入就是一种体现)
- 处理每一个错误
- 创建模块时的一些经验法则
- 承诺/生成器/ES6等
- Promises:编写异步代码的一种方式,它仍然以自顶向下的方式执行,并且由于鼓励使用try / catch样式错误处理而处理更多类型的错误
- Generators:生成器让你“暂停”单个函数,而不会暂停整个程序的状态,但代码要稍微复杂一些,以使代码看起来像自上而下地执行
- Async functions:异步函数是一个建议的ES7功能,它将以更高级别的语法进一步包装生成器和继承
什么是“回调地狱”?
.png)
方法1: Promise 链式调用的方式 ES6
.png)
.png)
.png)
- 执行一系列同步操作3.使用resolve函数将异步操作的结果传递出去, reject函数传递异步操作的错误4.用then方法分别指定Resolve状态和Reject状态的函数,then方法返回一个新的Promise实例,因此可以采用链式写法
.png)
.png)
.png)
.png)
.png)
.png)
.png)
.png)
.png)
.png)
js中的回调地狱 Callback to Hell的更多相关文章
- 关于js中的回调函数callback
来源于:http://www.jianshu.com/p/6bc353e5f7a3 前言 其实我一直很困惑关于js 中的callback,困惑的原因是,学习中这块看的资料少,但是平时又经常见,偶尔复制 ...
- 关于 js 中的回调函数 callback
本文写于1年前 曾经的学习文章如今拿出来分享 前言 其实我一直很困惑关于js中的callback,困惑的原因是,学习中这块看的资料少,但是平时又经常见,偶尔复制一下前人代码,功能实现了也就不再去追其原 ...
- 关于js中的回调函数callback,通俗易懂
前言 其实我一直很困惑关于js 中的callback,困惑的原因是,学习中这块看的资料少,但是平时又经常见,偶尔复制一下前人代码,功能实现了也就不再去追其原由,这么着,这个callback的概念就越来 ...
- 理解javascript中的回调函数(callback)【转】
在JavaScrip中,function是内置的类对象,也就是说它是一种类型的对象,可以和其它String.Array.Number.Object类的对象一样用于内置对象的管理.因为function实 ...
- js中的回调函数的理解和使用方法
js中的回调函数的理解和使用方法 一. 回调函数的作用 js代码会至上而下一条线执行下去,但是有时候我们需要等到一个操作结束之后再进行下一个操作,这时候就需要用到回调函数. 二. 回调函数的解释 因为 ...
- iOS 如何优雅的处理“回调地狱Callback hell”(一) (上)
前言 最近看了一些Swift关于封装异步操作过程的文章,比如RxSwift,RAC等等,因为回调地狱我自己也写过,很有感触,于是就翻出了Promise来研究学习一下.现将自己的一些收获分享一下,有错误 ...
- JS中的回调函数实例浅析
本文实例讲述了JS中的回调函数.分享给大家供大家参考,具体如下: 在说回调函数之前,不妨先看一段代码,相信有点js基础的同学都能明白他的含义: ? 1 2 3 document.getElementB ...
- 理解JS中的回调(Callback)函数
今天写代码时写了一个函数,想实现Nodejs查询pgSQL的数据查出来并把结果作为返回值,结果发现拿不到这个值,查了下资料才恍然大悟,这是Nodejs的最大特性--非阻塞! 查询数据操作作为比较消耗资 ...
- js中的回调函数 和promise解决异步操作中的回调地狱问题。
回调函数 : 函数作为参数传递到另外一个函数中.简单数据类型和引入数据类型中的数组和对象作为参数传递大家肯定都不陌生,其实引用数据类型中的函数也是可以的. 事实上大家见到的很多,用到的也很多,比如jQ ...
随机推荐
- 前端面试题常考&必考之--盒子模型和box-sizing(项目中经常使用)
主要考察width的值,包括padding\border\content等属性??? box-sizing属性是css3特有的哦*** 1>当box-sizing:content-box;时,跟 ...
- spring中试用junit4测试
一:加入jar包 <!-- 单元测试 --> <dependency> <groupId>junit</groupId> <artifactId& ...
- Bugku 杂项 宽带信息泄露
宽带信息泄露 flag是宽带用户名 下载文件后用RouterPassView打开,搜索username即可
- warp(图像仿射变换)
仿射变换是一种二维坐标(x,y)到二维坐标(u,v)的线性变换. 对应的齐次坐标矩阵表示形式为: 仿射变换特点: 直线经仿射变换后依然为直线: ’直线之间的相对位置关系保持不变,平行线经仿射变换后依然 ...
- JPA Hibernate 等面向对象持久化框架难以解决的问题
1+N查询性能问题 单个更新实体对象,而不是使用单调语句 在Java端做了很重的数据处理,数据库端反而很少 多层次 fetch inner join 难以实现 关联映射难以自定义条件 级联操作难以掌控 ...
- centos 6.8 安装 WebVirtMgr
1.kvm虚拟机已经用 virsh命令装好了 2. WebVirtMgr的安装步骤完全参照此处: https://github.com/retspen/webvirtmgr/wiki/Install- ...
- 高通Android camera运行流程【转】
本文转载自:http://blog.csdn.net/unicornkylin/article/details/13293295 1.总体架构 Android Camera 框架从整体上看是一个 cl ...
- VMware 虚拟化编程(15) — VMware 虚拟机的恢复方案设计
目录 目录 前文列表 将已存在的虚拟机恢复到指定时间点 恢复为新建虚拟机 灾难恢复 恢复细节 恢复增量备份数据 以 RDM 的方式创建虚拟磁盘 创建虚拟机 Sample of VirtualMachi ...
- Web高级 JavaScript中的算法
算法 排序算法 稳定排序 待排序序列中相等元素在排序完成后,原有先后顺序不变. 非稳定排序 有序度 待排序序列中有序关系的元素对个数. 逆序度 1. 插入排序 遍历有序数组,对比待插入的元素大小,找到 ...
- Linux的简介安装与简单使用
一: 适合初学者的最佳Linux发行版:Linux Mint 老旧硬件的最佳Linux发行版:Ubuntu MATE 安全行业的最佳Linux发行版:Kali Linux 专属游戏的Linux发行版: ...