当前位置: 首页 > news >正文

js 手写promise

const PENDING = 'pending';
const FULFILLED = 'fulfilled';
const REJECTED = 'rejected';class MyPromise {#status = PENDING;#result = undefined;#handler = undefined;constructor(executor) {// 不能写在外面,因为this指向会出问题const resolve = (data) => {this.#changeState(FULFILLED, data);}const reject = (err) => {this.#changeState(REJECTED, err);}try {executor(resolve, reject);} catch(err) {reject(err); }}#changeState (status, result) {if (this.#status !== PENDING) {return;}this.#status = status;this.#result = result;this.#run();}#run () {console.log(this, this.#handler);if (this.status === PENDING) {return;}const { onFulfilled, onRejected, resolve, reject } = this.#handler;// 回调不是函数,那么将当前的promise状态透传// 回调是函数,将函数执行返回值作为新的值传递,状态变为成功,执行过程报错,那么状态就为失败if(this.#status === FULFILLED) {if (typeof onFulfilled === 'function') {try {const res = onFulfilled(this.#result);resolve(res);} catch (err) {reject(err);}} else {resolve(this.#result);}} else {if (typeof onRejected === 'function') {try {const res = onRejected(this.#result);resolve(res);} catch (err) {reject(err);}} else {reject(this.#result);}}}then(onFulfilled, onRejected) {return  new MyPromise((resolve, reject) => {this.#handler = { onFulfilled, onRejected, resolve, reject };this.#run();});}
}const p = new Promise((resolve, reject) => {// setTimeout(() => {reject(222);// }, 0);// resolve(111);// throw 123;// setTimeout(() => {//     throw 123;  // 异步错误捕获不到,Promise也是一样// }, 0);
});p.then((res) => {console.log('成功1', res);
}, (err) => {console.log('失败1', err);return 333;
}).then(1, (err) => {console.log('失败2', err);
}).then((res) => {console.log('成功3', res);
}, (err) => {console.log('失败3', err);
}).then((res) => {console.log('成功4', res);
}, (err) => {console.log('失败4', err);
});const p1 = new MyPromise((resolve, reject) => {// setTimeout(() => {reject(222);// }, 0);// resolve(111);// throw 123;// setTimeout(() => {//     throw 123;  // 异步错误捕获不到,Promise也是一样// }, 0);
});p1.then((res) => {console.log('成功1', res);
}, (err) => {console.log('失败1', err);return 333;
}).then(1, (err) => {console.log('失败2', err);
}).then((res) => {console.log('成功3', res);
}, (err) => {console.log('失败3', err);
}).then((res) => {console.log('成功4', res);
}, (err) => {console.log('失败4', err);
});

其他静态方法

	static resolve(value) {return new MyPromise((resolve) => resolve(value));}static reject(reason) {return new MyPromise((resolve, reject) => reject(reason));}static all(promises) {// 问题关键: 什么时候要执行resolve, 什么时候要执行rejectreturn new MyPromise((resolve, reject) => {const values = [];promises.forEach((promise) => {promise.then((res) => {values.push(res);if (values.length === promises.length) {resolve(values);}},(err) => {reject(err);},);});});}static allSettled(promises) {return new MyPromise((resolve) => {const results = [];promises.forEach((promise) => {promise.then((res) => {results.push({ status: PROMISE_STATUS_FULFILLED, value: res });if (results.length === promises.length) {resolve(results);}},(err) => {results.push({ status: PROMISE_STATUS_REJECTED, value: err });if (results.length === promises.length) {resolve(results);}},);});});}static race(promises) {return new MyPromise((resolve, reject) => {promises.forEach((promise) => {promise.then(resolve, reject);});});}static any(promises) {// resolve必须等到有一个成功的结果// reject所有的都失败才执行rejectconst reasons = [];return new MyPromise((resolve, reject) => {promises.forEach((promise) => {promise.then(resolve, (err) => {reasons.push(err);if (reasons.length === promises.length) {reject(new AggregateError(reasons));}});});});}

相关文章:

  • 从解决一个分享图片生成的历史bug出发,详解LayoutInflater和View.post的工作原理
  • Golang | 搜索哨兵-对接分布式gRPC服务
  • 【Prompt Engineering】摸索出的一些小套路
  • 【mysql】-5 索引
  • C++智能指针用法及内存管理
  • Jenkins+Docker 实现一键自动化部署项目
  • Laravel单元测试使用示例
  • Git 使用规范
  • 【 java 基础问题 第二篇 】
  • 学习threejs,超炫银河黑洞效果模拟
  • 初识Docker:容器化技术的入门指南
  • 180 度 = π 弧度
  • [网页五子棋][匹配模块]前后端交互接口(消息推送机制)、客户端开发(匹配页面、匹配功能)
  • Android学习之定时任务
  • 大数据-273 Spark MLib - 基础介绍 机器学习算法 决策树 分类原则 分类原理 基尼系数 熵
  • 深入解析Linux死锁:原理、原因及解决方案
  • 《ChatGPT o3抗命:AI失控警钟还是成长阵痛?》
  • 基于对比学习的推荐系统开发方案,使用Python在PyCharm中实现
  • Transformer架构详解:从Attention到ChatGPT
  • Senna代码解读
  • 企业网站建设立项报告/中国十大企业管理培训机构
  • 网站建设 论文/大数据营销系统多少钱
  • 《高性能网站建设指南》/开发一个网站需要多少钱
  • 网站开发建设专业的公司/网络营销的基本功能
  • 门户网站制作的公司/普通话手抄报文字内容
  • 宝安建网站/搜索引擎广告形式有哪些