浅谈promise对象
背景:
最近项目在做小程序的开发,涉及设计一个统一的登录公共方法,当实现时涉及到多个异步请求,那么问题来了,如何让多个异步请求先后同步进行呢?很多人会想到使用多层嵌套套来实现,就像这样:
function fun1() {
fun2() {
fun3() {
fun4() {
}
}
}
}
可是嵌套难以维护而且耦合性很高、不方便。
苦寻百度,最后找到Promise,Promise就是这样一个专门解决多个异步请求问题的对象。
Promise
介绍
Promise是异步编程的一种解决方案,由社区提出,经ES6规范了标准,因此原生提供Promise。在浏览器中输入以下语句,看是否支持Promise,当然也可以使用Can I Use查一查兼容性
'use strict';//严格模式
new Promise(function () {});
理解
先从最基本的案例去了解一下Promise的用法。首先是基本嵌套使用:
//嵌套调用
function fun1() {
console.log('执行fun1');
//设置时间把fun1看作为异步方法
setTimeout(function() {
//...fun1执行完毕
fun2();
},2000);
}
function fun2() {
console.log('执行fun2');
}
fun1();
结果:
执行fun1
执行fun2
为了保证fun1执行完再调用fun2,一般我们会使用嵌套调用,待fun1完全执行再调用fun2。那Promise是怎样的思路呢?
function fun1() {
return new Promise(function(resolve,reject) {
console.log('执行fun1');
//设置时间把fun1看作为异步方法
setTimeout(function() {
//...fun1执行完毕
resolve();
},2000);
});
}
function fun2() {
console.log('执行fun2');
}
fun1().then(function(res) {
fun2();
}).catch(function(res) {
console.log("出错了");
});
结果:
执行fun1
执行fun2
当使用Promise解决异步时,思路会不一样,它是把未来结束的结果暴露出去(resolve),那么我们就可以继续同步(then)执行我们接下想做的事情(fun2),这就是Promise解决异步编程的基本思路。
概括来说,Promise对象就是一个容器(对象)包含了一些未来会结束的事件的结果。
特点
Promise包含了三种状态:pending(进行中)、fulfilled(已成功)和rejected(已失败)。而且只能从pending->fulfilled或者pending->和rejected,理解起来如下图:

常规用法
在帮公司写小程序时,总结出一个比较通用的Demo解决异步编程问题:
function fun1() {
return new Promise((resolve, reject) => {
// ... some code
if (/* 异步操作成功 */){
resolve(value);
} else {
reject(error);
}
});
}
function fun2() {
return new Promise((resolve, reject) => {
// ... some code
if (/* 异步操作成功 */){
resolve(value);
} else {
reject(error);
}
});
}
fun1().then(function (res) {
return fun2();
if (/*需要中止*/) {
var res = {'code':0};
return Promise.reject();//通过reject直接跳到catch
}
}).then(function (res) {
//最后的事情...
}).catch(function (res) {
if (res.code != 0) {
//错误时执行的代码
}
});
首先我们定义一个异步方法,一般方法都会有两个状态成功和失败,比如ajax,那么我们可以成功是执行resolve,失败时执行reject,这样我们通过结果来操作下一步。
那好啦,接着我们写方法的整体流程,通过then和catch方法来捕捉方法执行后的结果。then方法可以保证代码顺序地执行,应该可以有多个;而catch一个就够了,就是用来捕捉错误(有点像try...catch),但是还有另外一种用法,就是通过在then中写如上的代码,就可以达到中止的效果,我的思路就是通过reject一个code到catch中,这样就可以判断到底你是中止还是错误了。
这是本人的一些粗浅见解,你需要更详细的教程应该去百度搜一下阮一峰和廖雪峰老师的教程,如写得不足之处可以给我留言探讨。
浅谈promise对象的更多相关文章
- python学习(28) 浅谈可变对象的单例模式设计
python开发,有时候需要设计单例模式保证操作的唯一性和安全性.理论上python语言底层实现和C/C++不同,python采取的是引用模式,当一个对象是可变对象,对其修改不会更改引用的指向,当一个 ...
- 浅谈 js 对象 toJSON 方法
前些天在<浅谈 JSON.stringify 方法>说了他的正确使用姿势,今天来说下 toJSON 方法吧.其实我觉得这货跟 toString 一个道理,他是给 stringify 方法字 ...
- 浅谈Promise
学习过JavaScript的人都知道,JavaScript是单线程作业,这样会有一个很大的缺陷,所有的Ajax,浏览器事件等,都是通过异步去完成.所谓的同步和异步最大的区别无非就是在于同步会阻塞后续代 ...
- 浅谈Promise原理与应用
在JavaScript中,所有代码都是单线程.由于该“缺陷”,JavaScript在处理网络操作.事件操作时都是需要进行异步执行的.AJAX就是一个典型的异步操作 对于异步操作,有传统的利用回调函数和 ...
- JS核心系列:浅谈原型对象和原型链
在Javascript中,万物皆对象,但对象也有区别,大致可以分为两类,即:普通对象(Object)和函数对象(Function). 一般而言,通过new Function产生的对象是函数对象,其他对 ...
- 浅谈Js对象的概念、创建、调用、删除、修改!
一.我们经常困惑,对象究竟是什么,其实这是一种思维,一种意识上的东西,就像我们都说 世界是有物质组成的道理一样,理解了下面的几句话!对象也不是那么抽象! 1.javascript中的所有事 ...
- 浅谈Java对象回收的三种方式
半夜睡不着,加上最近在看Java虚拟机,写点给新手和自己看的东西. 第一类:生命周期中止 void scope(){ Test t = new Test(); } 第二类:对象无引用 (一).对象的应 ...
- HTML5 拖放(Drag 和 Drop)功能开发——浅谈dataTransfer对象
[前言] 之前我已经为大家介绍过一篇有关HTML5中原生拖拽的相关知识了.今天为大家介绍HTML5拖拽中的其他一些关于dataTransfer对象的知识和应用. dataTransfer对象 之前的一 ...
- 浅谈Pool对象
Pool对象的技术指标: 避免频繁创建经常使用的稀有资源,提高工作效率. 控制阀值,很多情况下一些关键资源都有一个最佳并发数,超过这个拐点性能有可能急剧下降,也有可能继续增大并发数性能不能提升. 安全 ...
- 浅谈Java对象的equals方法
相等与同一: 如果两个对象具有相同的类型以及相同的属性值,则称这两个对象相等. 如果两个引用对象指的是同一个对象,则称这两个变量同一. ==是一个比较运算符,基本数据类型比较的是值,引用数据类型比较的 ...
随机推荐
- Java之POI导出Excel(二):多个sheet
相信在大部分的web项目中都会有导出导入Excel的需求,之前我也写过一篇导出单个sheet工作表的文章,没看过的小伙伴可以去看哈,链接也给大家放出来了:导出单个sheet 但是在我们日常的工作中,需 ...
- Python 实现Tracert追踪TTL值
Tracert 命令跟踪路由原理是IP路由每经过一个路由节点TTL值会减一,假设TTL值=0时数据包还没有到达目标主机,那么该路由则会回复给目标主机一个数据包不可达,由此我们就可以获取到目标主机的IP ...
- webpack打包思路与流程解析
一:创建一个新的工程,项目初始化 npm init -y 二:搭建项目框架 三:编写main.js文件内容,在index.js中引入,在把index.js引入到index.html中 例: expor ...
- 关于docker-环境部署及拉取镜像创建容器的过程记录
背景:因安全部门要求对特定几台应用主机的进行漏洞及脆弱性扫描,使用的工具需要基于docker环境,即他们提供镜像,让我们创建成容器,于是将整个环境安装及创建docker容器的过程记录于此 1.还是先得 ...
- 记录一次成功反混淆脱壳及抓包激活app全过程
记录一次成功反混淆脱壳及抓包激活app全过程 前言 近期接到一个需求,要对公司之前开发的一款app进行脱壳.因为该app是两年前开发的,源代码文件已经丢失,只有加壳后的apk文件,近期要查看其中一 ...
- eDP接口简介
1. eDP背景介绍 随着显示分辨率的越来越高,传统的VGA.DVI等接口逐渐不能满足人们的视觉需求. 随后就产生了以HDMI.DisplayPort为代表的新型数字接口,外部接口方面HDMI占据 ...
- 盘它!基于CANN的辅助驾驶AI实战案例,轻松搞定车辆检测和车距计算!
摘要:基于昇腾AI异构计算架构CANN(Compute Architecture for Neural Networks)的简易版辅助驾驶AI应用,具备车辆检测.车距计算等基本功能,作为辅助驾驶入门级 ...
- 三十五、kubernetes NameSpace介绍
Kubernetes NameSpace 介绍 Kubernetes使用命名空间的概念帮助解决集群中在管理对象时的复杂性问题.命名空间允许将对象分组到一起,便于将它们作为一个单元进行筛选和控制.无论是 ...
- C++11绑定器bind及function机制
前言 之前在学muduo网络库时,看到陈硕以基于对象编程的方式,大量使用boost库中的bind和function机制,如今,这些概念都已引入至C++11,包含在头文件<functional&g ...
- 逆向使用 execjs时遇到 UnicodeDecodeError: 'gbk' codec can't decode byte 0x80 in position 28: illegal multibyte sequence
问题: 如下图所示 今天在维护以前的爬虫代码 发现有个网站一直爬取失败,我原以为是网站逆向的部分改了,搞了好久才发现是GBK的问题 接下来告诉大家解决方案 解决方案 如下图 在下图这个subbsubp ...