如何在外部终止一个pengding的promise对象
今天在整理前段时间做过的项目,发现之前在集成web环信的时候遇到过一个奇怪的需求:
需要终止一个正在进行等待返回的promise,或者阻止其调用resolve和reject。(具体为何会有这种需求我也不太记得了。。。
现在回头看,一定会有其他的常规解决方案)。
不过本着对未知牛角尖的专研精神(最近有点闲),在咨询知乎大神,重读阮大神的《es6入门》书中promise一章后,
找到了一个原生js的解决方案:Promise.race。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<button onclick="getInterface()">发送请求</button>
<button id="cancel">取消调用接口</button>
<script type="text/javascript">
//Promise.race([a,b])参数为一个promise对象组成的数组,
//此方法用来比较啊a和b哪一个promise先返回,Promise.race结果就返回这个先返回的promise参数 function getInterface() {
var promise1 = new Promise(function(resolve, reject) {
//模拟ajax异步请求
setTimeout(resolve, 3000, '接口返回成功!');
});
var promise2 = new Promise(function(resolve, reject) {
document.querySelector('#cancel').addEventListener('click', function() {
reject('取消等待接口!');
});
}); Promise.race([promise1, promise2]).then(function(value) {
console.log(value);
}).catch(function(value) {
console.log(value);
});
}
</script>
</body>
</html>
上面的代码点击发送请求按钮后,调用getIterface方法,
方法内创建并立即执行两个promise函数:promise1和promise2。Promise.race方法立即开始监听这两个promise对象的状态。
1. 如果3秒内用户有任何操作,那么promise1内的resolve方法被调用:此时“接口”返回成功,Promise.race不再监听promise2的状态,
直接返回接口的返回结果:'接口返回成功!'。
2. 如果3秒内用户点击取消调用接口按钮 ,那么promise2内的reject方法被调用,此时Promise.race不再监听promise2(异步接口)的返回状态,
直接返回promise2的返回结果:'取消等待接口'。
这样就可以模拟外部中断promise返回结果了,比如 promise1是一个ajax请求,那么就可以在返回前在Promise.race中abort()请求了。
如何在外部终止一个pengding的promise对象的更多相关文章
- 手把手教你实现一个完整的 Promise
用过 Promise,但是总是有点似懂非懂的感觉,也看过很多文章,还是搞不懂 Promise的 实现原理,后面自己边看文章,边调试代码,终于慢慢的有感觉了,下面就按自己的理解来实现一个 Promise ...
- Promise原理讲解 && 实现一个Promise对象 (遵循Promise/A+规范)
1.什么是Promise? Promise是JS异步编程中的重要概念,异步抽象处理对象,是目前比较流行Javascript异步编程解决方案之一 2.对于几种常见异步编程方案 回调函数 事件监听 发布/ ...
- ES6 Promise 对象
Promise 的含义 Promise 是异步编程的一种解决方案,比传统的解决方案--回调函数和事件--更合理和更强大.它由社区最早提出和实现,ES6 将其写进了语言标准,统一了用法,原生提供了Pro ...
- 微信小程序Promise对象
Promise 对象 Promise 的含义 基本用法 Promise.prototype.then() Promise.prototype.catch() Promise.prototype.fin ...
- 13.Promise 对象
Promise 对象 Promise 对象 Promise 的含义 Promise 是异步编程的一种解决方案,比传统的解决方案--回调函数和事件--更合理和更强大.它由社区最早提出和实现,ES6 将其 ...
- ES6的Promise对象
http://es6.ruanyifeng.com/#docs/promise Promise 对象 Promise 的含义 基本用法 Promise.prototype.then() Promise ...
- ES6的新特性(15)——Promise 对象
Promise 对象 Promise 的含义 Promise 是异步编程的一种解决方案,比传统的解决方案——回调函数和事件——更合理和更强大.它由社区最早提出和实现,ES6 将其写进了语言标准,统一了 ...
- ES6入门之Promise对象
1. Promise 的含义 Promise 是异步编程的一种解决方案,比传统的解决方案--回调函数和事件更合理.更强大. 1.1 什么是Promise 简单来说就是一个容器,里面保存着某个未来才会结 ...
- 不难懂————Promise对象 + 详解
1.Promise 的含义 Promise 是异步编程的一种解决方案,比传统的解决方案--回调函数和事件--更合理和更强大.它由社区最早提出和实现,ES6 将其写进了语言标准,统一了用法,原生提供了P ...
随机推荐
- ASP.NET Core 一步步搭建个人网站(4)_主页和登录验证
上章节我们已经定制好动态配置的菜单,用户登录网站的第一步就是进入首页内容,那我们先搭建一下我们的首页内容.想着自己的网站内容主要是个人博客类型,所以,首页就展示博主本人的一些基本信息吧,哈哈.当然,做 ...
- 【转】String Date Calendar之间的转换
1.Calendar 转化 String Calendar calendat = Calendar.getInstance(); SimpleDateFormat sdf = new SimpleDa ...
- 使用svn 的解决 处理svn状态冲突
当直接只用版本浏览器进行svn的删除操作是,在客户端svn目录里,出现svn版本错误信息提示,使用 svn 解决命令,处理冲突保存 svn resolve --accept=working PATH( ...
- golang 多维数组
具体的题目如下:(就是将多维数组的行列互换) A multi-dimensional array is an array of arrays. 2-dimensional arrays are the ...
- lbp特征提取(等价模式)
LBP等价模式 考察LBP算子的定义可知,一个LBP算子可以产生多种二进制模式(p个采样点)如:3x3邻域有p=8个采样点,则可得到2^8=256种二进制模式:5x5邻域有p=24个采样点,则可得到2 ...
- @EnableAsync annotation metadata was not injected
[问题描述] @EnableAsync annotation metadata was not injected spring配置初始化时候报错 nested exception is java.la ...
- Vista 及后续版本的新线程池
在上一篇的博文中,说了下老版本的线程池,在Vista之后,微软重新设计了一套线程池机制,并引入一组新的线程池API,新版线程池相对于老版本的来说,它的可控性更高,它允许程序员自己定义线程池,并规定线程 ...
- 快速开发基于 HTML5 网络拓扑图应用--入门篇(二)
上一篇我们绘制了一个 graphView 场景,在场景之上通过 graphView.dm() 获取数据容器,并通过 graphView.dm().add() 函数添加了两个 Node 节点,并通过 s ...
- 跟我一起读postgresql源码(十)——Executor(查询执行模块之——Scan节点(下))
接前文跟我一起读postgresql源码(九)--Executor(查询执行模块之--Scan节点(上)) ,本篇把剩下的七个Scan节点结束掉. T_SubqueryScanState, T_Fun ...
- [整理]k-vim-for-server通过vimrc修改vim格式
1.备份原来的vim设置: cp ~/.vimrc ~/.vimrc_bak 2. 下载配置到指定目录 法一: curl https://raw.githubusercontent.com/wklke ...