转载自 为Promise插上可取消的翅膀

const makeCancelable = (promise) => {
let hasCanceled_ = false;
const wrappedPromise = new Promise((resolve, reject) => {
promise.then((val) =>
hasCanceled_ ? reject({isCanceled: true}) : resolve(val)
);
promise.catch((error) =>
hasCanceled_ ? reject({isCanceled: true}) : reject(error)
);
});
return {
promise: wrappedPromise,
cancel() {
hasCanceled_ = true;
},
};
};

  

//调用
const somePromise = new Promise(r => setTimeout(r, 1000));//创建一个异步操作
const cancelable = makeCancelable(somePromise);//为异步操作添加可取消的功能
cancelable
.promise
.then(() => console.log('resolved'))
.catch(({isCanceled, ...error}) => console.log('isCanceled', isCanceled));
// 取消异步操作
cancelable.cancel();

  

[Web] 取消Promise的更多相关文章

  1. react hooks useEffect 取消 promise

    react hooks useEffect 取消 promise cancel promise https://github.com/facebook/react/issues/15006#issue ...

  2. 中断或取消Promise链的可行方案

    ES6标准引入的异步编程解决方案Promise,能够将层层嵌套的回调转化成扁平的Promise链式调用,优雅地解决了“回调地狱”的问题.当Promise链中抛出一个错误时,错误信息沿着链路向后传递,直 ...

  3. js 如何取消promise

    1: 使用reject function hello() { let _res, _rej: any; const promise = new Promise((res, rej) => { _ ...

  4. Promise小书(长文)

    promise基础 Promise是异步编程的一种解决方案.ES6 Promise的规范来源于Promises/A+社区,它有很多版本的实现. Promise比传统的解决方案(回调函数和事件)更合理和 ...

  5. JavaScript之Promise对象

    含义 Promise 是异步编程的一种解决方案,比传统的解决方案--回调函数和事件--更合理和更强大.它由社区最早提出和实现,ES6 将其写进了语言标准,统一了用法,原生提供了 Promise 对象. ...

  6. BAT 前端开发面经 —— 吐血总结 前端相关片段整理——持续更新 前端基础精简总结 Web Storage You don't know js

    BAT 前端开发面经 —— 吐血总结   目录 1. Tencent 2. 阿里 3. 百度 更好阅读,请移步这里 聊之前 最近暑期实习招聘已经开始,个人目前参加了阿里的内推及腾讯和百度的实习生招聘, ...

  7. Web前端面试题整合,持续更新【可以收藏】

    饭后闲来无事,把这几年带学生用的一些面试题整合一下,供上!拿走,不客气!应付一般公司的二面基本上是够用了.祝你早日拿到心仪的offer. css相关 1. 万能居中 1.margin: 0 auto; ...

  8. ES6深入学习记录(二)promise对象相关

    1.Promise的含义 Promise是异步编程的一种解决方案,比传统的解决方案--回调函数和事件更合理和强大.ES6将其写进了语言标准,统一了用法,原生提供了promise对象. 所谓Promis ...

  9. Javascript 中的神器——Promise

    Promise in js 回调函数真正的问题在于他剥夺了我们使用 return 和 throw 这些关键字的能力.而 Promise 很好地解决了这一切. 2015 年 6 月,ECMAScript ...

随机推荐

  1. Redux 和React 结合

    当Redux 和React 相接合,就是使用Redux进行状态管理,使用React 开发页面UI.相比传统的html, 使用React 开发页面,确实带来了很多好处,组件化,代码复用,但是和Redux ...

  2. FreePascal - CodeTyphon 如何调整代码编辑器背景色?

    当前版本的CodeTyphon默认背景色是黑色,看起来很不习惯,通过下面操作,修改了它的代码编辑器的背景色: 1,打开CodeTyphon的菜单“工具”->“选项”. 2,选择左侧列表项目“颜色 ...

  3. 避免SQL全表模糊查询查询 下载文件时-修改文件名字

    避免SQL全表模糊查询查询   1.模糊查询效率很低: 原因:like本身效率就比较低,应该尽量避免查询条件使用like:对于like %...%(全模糊)这样的条件,是无法使用索引的,全表扫描自然效 ...

  4. mysql: show processlist 详解

    最近排查一些MySQL的问题,会经常用到 show processlist,所以在这里把这个命令总结一下,做个备忘,以备不时只需. show processlist 是显示用户正在运行的线程,需要注意 ...

  5. python生成图片二维码(利用pillow)

    首先 pip install pillow 然后 from PIL import Image from PIL import ImageDraw from PIL import ImageFont i ...

  6. linux设备驱动程序--gpio控制

    gpio驱动程序 上一章节linux设备驱动程序--创建设备节点章节主要介绍了linux字符设备驱动程序的框架,从这一章节开始我们讲解各种外设的控制,包括gpio,i2c,dma等等,既然是外设,那就 ...

  7. JAVA构造器,重载与重写

    1. java构造器 构造器也叫构造方法(constructor), 用于对象初始化. 构造器是一个创建对象时被自动创建的特殊方法,目的是对象的初始化. 构造器 的名称与类的名称一致. JAVA通过n ...

  8. Unity 渲染教程(四):第一个光源

    将法线从物体空间转换到世界空间. 使用方向光. 计算漫反射和镜面高光反射. 实现能量守恒. 使用金属的工作流程. 利用Unity的基于物理规则渲染的算法. 这是关于渲染基础的系列教程的第四部分.前面的 ...

  9. 2019年杭电多校第三场 1011题Squrirrel(HDU6613+树DP)

    题目链接 传送门 题意 给你一棵无根树,要你寻找一个根节点使得在将一条边权变为\(0\)后,离树根最远的点到根节点的距离最小. 思路 本题和求树的直径很像,不过要记得的东西有点多,且状态也很多. \( ...

  10. 服务器端渲染 VS 浏览器端渲染

    这里的渲染,就是指生成html文档的过程,和浏览器渲染html没有关系. 浏览器端渲染,指的是用js去生成html,前端做路由.举例:React, Vue等等前端框架.适合单页面应用程序. 服务器端渲 ...