Promise静态方法实现(all race finally resolve reject)
示例
// Promise.resolve()
Promise.resolve(1).then((data) => {
console.log(data) // 1
})
// Promise.reject()
Promise.reject(2).catch((data) => {
console.log(data) // 2
})
// Promise.all()
// 多个Promise都成功后获取结果,调用成功回调,如果有一个promise失败了,all返回的promise对象也会失败,调用失败回调
Promise.all([1, new Promise((res, rej) => { res(10) })]).then((data) => {
console.log(data) // [1, 10]
})
// Promise.finally()不管上一个promise状态是什么 都会执行
Promise.resolve(111).finally((data) => {
console.log(data) // undefined
return 2;
// return new Promise((resolve, reject) => {
// reject('222')
// })
}).then(data => {
console.log(data) // 111
}).catch(reason => {
console.log(reason) // finally中返回失败的promise才执行
}) // race 谁最快改变状态 就执行谁的回调
Promise.race([1,3]).then(data => {
console.log(data) // 1
}).catch(err => console.log(data))
手写实现
class MyPromise {
static finally(callback) {
return this.then(data => {
// 直接调用callback()无法处理异步代码
Promise.resolve(callback()).then(() => data)
}, err => {
Promise.resolve(callback()).then(() => {throw err})
})
}
static all(promises) {
let results = [];
let promiseCount = 0;
let promisesLength = promises.length;
return new Promise(function(resolve, reject) {
for (let val of promises) {
// 将普通值也包装成promise来处理
Promise.resolve(val).then(function(res) {
// 记录当前执行了几个promise
promiseCount++;
// 成功回调的参数存放到结果数组中
results.push(res);
// 当所有promise都为成功转态,在all返回的promise实例中调用resolve,传入结果数组。 if (promiseCount === promisesLength) {
return resolve(results);
}
}, function(err) {
return reject(err);
});
}
});
} static race(proms) {
return new Promise((resolve, reject) => {
proms.forEach((p) => {
p.then(
(data) => {
resolve(data);
},
(err) => {
reject(err);
},
);
});
});
} static resolve(data) {
if (data instanceof Promise) {
return data;
} else {
return new Promise((resolve) => {
resolve(data);
});
}
} static reject(reason) {
return new Promise((resolve, reject) => {
reject(reason);
});
}
}
Promise静态方法实现(all race finally resolve reject)的更多相关文章
- [js高手之路] es6系列教程 - promise常见用法详解(resolve,reject,catch,then,all,race)
关于promise我在之前的文章已经应用过好几次,如[js高手之路]Node.js+jade+express+mongodb+mongoose+promise实现todolist,本文就来讲解下pro ...
- es6中promise ALL Race Resolve Reject finish的实现
function mypromise(func){ this.statue = "pending"; this.data = null; this.resolveCallback ...
- Promise(resolve,reject)的基本使用
什么是Promise? Promise是一个构造函数,其原型上有 then.catch方法,还有reslove,reject等静态方法.通过创建Promise实例,可以调用Promise.protot ...
- ES6的promise的学习
1.Promise的含义: Promise是异步编程的一种解决方案,比传统的解决方案——回调函数和事件——更合理和更强大.它由社区最早提出和实现,ES6将其写进了语言标准,统一了用法,原生提供了Pro ...
- Promise探讨
一.前言 大家都知道JavaScript一大特点就是单线程,为了不阻塞主线程,有些耗时操作(比如ajax)必须放在任务队列中异步执行.传统的异步编程解决方案之一回调,很容易产生臭名昭著的回调地狱问题. ...
- 一起学习造轮子(一):从零开始写一个符合Promises/A+规范的promise
本文是一起学习造轮子系列的第一篇,本篇我们将从零开始写一个符合Promises/A+规范的promise,本系列文章将会选取一些前端比较经典的轮子进行源码分析,并且从零开始逐步实现,本系列将会学习Pr ...
- 分步理解 Promise 的实现
一个 Promise 的运用: var firstPromise = new Promise(function(resolve,reject){ setTimeout(function(){ var ...
- HTML5学习笔记(十九):Lambda和Promise
Lambda 在ES6的标准中称为Arrow Function(箭头函数).下面是一个简单的箭头函数: x => x * x 上面的定义和下面的代码定义效果一样: function (x) { ...
- Promise原理剖析
传统的异步回调编程最大的缺陷是:回调地狱,由于业务逻辑非常复杂,代码串行请求好几层:并行请求以前也要通过引用step.async库实现.现在ES6推出了Promise,通过Promise的链式调用可以 ...
- Promise 源码分析
前言 then/promise项目是基于Promises/A+标准实现的Promise库,从这个项目当中,我们来看Promise的原理是什么,它是如何做到的,从而更加熟悉Promise 分析 从ind ...
随机推荐
- Angualr动态加载组件
<ng-container *ngComponentOutlet="customComponent"></ng-container>
- laravel 软删除的使用
1.模型层 引用类use Illuminate\Database\Eloquent\SoftDeletes;class类中引用软删除use SoftDeletes;然后执行正常的删除,列表已经不显示, ...
- [BOM]判断是否为pc页面、是否为ios页面
常用于pc页面与h5页面的跳转和适配,区分不同设备进行下载跳转区分. var is_pc = !(navigator.userAgent.match(/(phone|pad|pod|iPhone|iP ...
- docker (mysql 8.+ )主从同步
1.环境centos7.5 docker 2.下载docker 版本的mysql 启动容器 docker run --name mysql_master -p 3306:3306 -e MYSQL_ ...
- 【Nday】Spring-Cloud-SpEL-表达式注入漏洞复现
# 环境搭建 JDK 15下载: https://www.oracle.com/java/technologies/javase/jdk15-archive-downloads.html 在Cen ...
- 打开part文件夹
1 #include <uf.h> 2 #include <uf_ui.h> 3 #include <uf_part.h> 4 #include <atlst ...
- node.js发送短信验证码(附带60秒倒计时插件)
推荐一个简单且功能齐全的发送短信验证码接口1.安装下载后的SDK只包含一个zhenzisms.js文件,直接导入到工程中即可使用.下载 2.用法引入模块 const zhenzismsClient = ...
- C语言II一作业02
1.作业头 | 这个作业属于哪个课程 | < https://edu.cnblogs.com/campus/zswxy/SE2020-3> | | ---- | ---- | ---- | ...
- ES6的Map和Set的了解和练习
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- sat初学入门资料2022-12
1. GlueMiniSatPPT-nabeshima.pdf A fast SAT solver with an aggressive acquiring strategy of glue clau ...