前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >实现一个简易版的Promise

实现一个简易版的Promise

作者头像
子夜星辰
发布2022-11-15 16:23:45
1670
发布2022-11-15 16:23:45
举报
文章被收录于专栏:李白偷偷偷猪
代码语言:javascript
复制
// 三个常量⽤于表示状态
const PENDING = 'pending'
const RESOLVED = 'resolved'
const REJECTED = 'rejected'
function MyPromise(fn) {
	const that = this
	this.state = PENDING
 	// value 变量⽤于保存 resolve 或者 reject 中传⼊的值
 	this.value = null
 	// ⽤于保存 then 中的回调,因为当执⾏完 Promise 时状态可能还是等待中,这时候应该把
 	that.resolvedCallbacks = []
 	that.rejectedCallbacks = []
 	function resolve(value) {
 		// ⾸先两个函数都得判断当前状态是否为等待中
 		if(that.state === PENDING) {
 			that.state = RESOLVED
 			that.value = value
			// 遍历回调数组并执⾏
			that.resolvedCallbacks.map(cb=>cb(that.value))
		 }
	 }
 	function reject(value) {
		if(that.state === PENDING) {
 			that.state = REJECTED
 			that.value = value
 			that.rejectedCallbacks.map(cb=>cb(that.value))
 		 }
	 }
 	// 完成以上两个函数以后,我们就该实现如何执⾏ Promise 中传⼊的函数了
 	try {
 		fn(resolve,reject)
 	}cach(e){
		reject(e)
 	} 
 }
// 最后我们来实现较为复杂的 then 函数
MyPromise.prototype.then = function(onFulfilled,onRejected){
 	const that = this
 	// 判断两个参数是否为函数类型,因为这两个参数是可选参数
 	onFulfilled = typeof onFulfilled === 'function' ? onFulfilled : v=>v
 	onRejected = typeof onRejected === 'function' ? onRejected : e=>throw e
 	// 当状态不是等待态时,就去执⾏相对应的函数。如果状态是等待态的话,就往回调函数中 push 
 	if(this.state === PENDING) {
 		this.resolvedCallbacks.push(onFulfilled)
 		this.rejectedCallbacks.push(onRejected)
 	}
 	if(this.state === RESOLVED) {
 		onFulfilled(that.value)
	}
 	if(this.state === REJECTED) {
		onRejected(that.value)
 	}
 }

详细实现Promise.then,catch,race,resolve,reject等方法,可参考此文章, 链接: https://juejin.cn/post/6866372840451473415#heading-13.

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2021-07-14,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档