关于Promise层层嵌套可读性差问题
Promise对象Promise对象是一个构造函数,用来生成Promise实例。 const promise = new Promise(function(resolve, reject) {
// ... some code 这里写异步操作代码
ajax(api1,function(res){
// 异步操作成功,请求数据成功
resolve(value);//将promise设置为resolved(完成状态)
},function(error){
// 异步操作失败,请求数据失败
reject(error);////将promise设置为rejected (失败状态)
})
});
resolve函数的作用是 在异步操作成功时调用,并将异步操作的结果,作为参数传递出去;reject函数的作用是 在异步操作失败时调用,并将异步操作报出的错误,作为参数传递出去Promise实例生成以后,可以用then方法分别指定resolved状态和rejected状态的回调函数。promise.then(function(value) {
// success
}, function(error) {
// failure
});
then方法可以接受两个回调函数作为参数。第一个回调函数是Promise对象的状态变为resolved时调用,第二个回调函数是Promise对象的状态变为rejected时调用。其中,第二个函数是可选的,不一定要提供。这两个函数都接受Promise对象传出的值作为参数。
上面代码也可成如下形式
promise.then(function(value) {
// success
}).catch(function(error){
//error
})
在success 里面我们可以发起第二个请求
promise.then(function(value) {
// success
ajax(api2,function(res){
})
}).catch(function(error){
//error
})
这个时候我们的两个请求明显的就有顺序
像是这样 new Promise(ajax1).then(ajax2).catch() ,使用了链式调用代替了嵌套结构,这样就避免了层层嵌套使的代码可读性太差!
关于Promise层层嵌套可读性差问题的更多相关文章
- 拥抱基于jquery.deferred的ajax,和层层嵌套回调的ajax说拜拜
前言 在项目中,无论是维护自己的代码,还是重构他人的项目代码,看到层层嵌套,异常冗余的某个function,那时我们的内心肯定是奔溃的! 在jquery1.5版本之前,如果我们某个操作需要多个ajax ...
- Vue递归组件实现层层嵌套显示数据
问题来自朋友...记录一下 需求是表格头部后端返回的数据中是不确定的 n维数据,表头存在于 listVo 字段中,如何实现层层显示呢? 温馨提示,以下内容为5张大图,请打开 WIFI 享用... 以下 ...
- ECMAScript6的Promise对象
1. 概念 Promise对象用于异步(asynchronouss)计算,一个Promise对象代表着一个还未完成,但预期完成的操作. 2. 出现原因: 1) 如果你需要通过ajax发送多次请求,而 ...
- ES6 - promise对象
Promise的设计初衷 我们使用ajax请求数据,得到数据后再对数据进行操作,可是有时候,对得到的数据进行操作的过程中,可能又要用到ajax请求,这时,我们的代码就变成了这样: $.ajax({ s ...
- promise async await使用
1.Promise (名字含义:promise为承诺,表示其他手段无法改变) Promise 对象代表一个异步操作,其不受外界影响,有三种状态: Pending(进行中.未完成的) Resolved( ...
- 这次聊聊Promise对象
欢迎大家前往腾讯云+社区,获取更多腾讯海量技术实践干货哦~ 本文由前端林子发表于云+社区专栏 Promise是CommonJS提出的一种规范,在ES6中已经原生支持Promise对象,非ES6环境可以 ...
- 关于Promise的一些个人理解jQuery的deferred
一.什么是deferred对象? 开发网站的过程中,我们经常遇到某些耗时很长的javascript操作.其中,既有异步的操作(比如ajax读取服务器数据),也有同步的操作(比如遍历一个大型数组), ...
- JS - Promise使用详解--摘抄笔记
第一部分: JS - Promise使用详解1(基本概念.使用优点) 一.promises相关概念 promises 的概念是由 CommonJS 小组的成员在 Promises/A 规范中提出来的. ...
- ES6 Promise用法详解
What is Promise? Promise是一个构造函数,接受一个参数(Function),并且该参数接受两个参数resolve和reject(分别表示异步操作执行成功后的回调函数.执行失败后的 ...
随机推荐
- Leetcode-35.搜索插入位置
题目描述: 给定一个排序数组和一个目标值,在数组中找到目标值,并返回其索引.如果目标值不存在于数组中,返回它将会被按顺序插入的位置. 你可以假设数组中无重复元素. 示例 1: 输入: [1,3,5,6 ...
- Python2.7与3.6的一些区别
2.7实现了一部分3的功能, 更早版本可能会稍稍涉及一点 首先是关键字的差别 python3.6 import keyword print(keyword.kwlist) ['False', 'Non ...
- ASP.NET Core学习系列
.NET Core ASP.NET Core ASP.NET Core学习之一 入门简介 ASP.NET Core学习之二 菜鸟踩坑 ASP.NET Core学习之三 NLog日志 ASP.NET C ...
- 通过 iis或者本地IP 调试代码
首先说下这个操作的意义,做微信开发每次需要将代码部署后才能调试.现在设置了Nginx服务器,生产环境可以指向正式服务器地址,调试时可以将Nginx指向自己的PC,但是vs调试启动的默认地址是[loca ...
- HDU-魔咒词典(字符串hash)
魔咒词典 TimeLimit: 8000/5000 MS (Java/Others) MemoryLimit: 32768/32768 K (Java/Others) 64-bit integer ...
- WPF 10天修炼 第二天- XAML语言
XAML是什么 XAML是一种与.NET CLR紧密集成的声明性UI标记语言.XAML中的对象元素对应到CLR中的类型或结构.XAML命名空间对应到CLR中类的命名空间,元素类型则对应到CLR中的类型 ...
- Vue实例学习过程中碰到的小问题
在使用插值表达式{{ }}取data中list数组中的值时把整个表达式当做文本显示了,原因不明,但是使用v-text替换插值表达式之后问题得到解决. 原因已经查明,因为第78行,定义对象car时后面 ...
- Loadrunner测试数据库性能,测试SQL语句的脚本例子
Loadrunner与SQL Server的操作可以通过录制的方式来实现,但本文还是通过直接调用loadrunner本身的function来实现sql语句的操作, 主要用到的是lr_db_connec ...
- spring-cloud-ribbon负载均衡组件
Ribbon简介: Spring Cloud Ribbon 是一个基于 HTTP 和 TCP 的客户端负载均衡工具,它基于 Netflix Ribbon 实现. 通过 Spring Cloud 的封装 ...
- Django—视图
索引 一.URLconf 二.视图 三.HttpReqeust对象 3.1 QueryDict对象 3.2 GET和POST属性 四.HttpResponse对象 4.1 子类JsonResponse ...