Promise的原理实现--笔记整理

最新推荐文章于 2023-01-10 09:45:58 发布

HongfeiAn

最新推荐文章于 2023-01-10 09:45:58 发布

阅读量156

点赞数

分类专栏： ES6 前端

本文链接：https://blog.csdn.net/qq_41601327/article/details/105837052

版权

前端同时被 2 个专栏收录

18 篇文章 0 订阅

订阅专栏

ES6

3 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
	</head>
	<body>
		<script type="text/javascript">
			var fn = function(resolve, reject) {
				setTimeout(function() {
					if (true) {
						resolve('成功')
					} else {
						reject('失败')
					}
				}, 3000)
			}

			class AhfPromise {
				constructor(fn) {
					//将成功的函数都集成在successList数组里
					this.successList = [];
					//将所有失败的函数集成到failList里
					this.failList = [];
					//pending,fullfilled,rejected
					this.state = 'pending';
					//传入的函数对象，（异步操作的函数内容）
					fn(this.resolveFn.bind(this), this.rejectFn.bind(this))
				}
				then(successfn, failFn) {
					if (typeof successfn == "function") {
						this.successList.push(successfn)
					}
					if (typeof failFn == "function") {
						this.failList.push(failFn)
					}
				}
				catch (failFn) {
					if (typeof failFn == "function") {
						this.failList.push(failFn)
					}
				}
				resolveFn(res) {
					this.state = 'fullfilled'
					this.successList.forEach(function(item, index) {
						//将成功的事件循环调用
						item(res);
					})
				}
				rejectFn(res) {
					this.state = 'rejected'
					//注册到的失败的事件循环调用
					this.failList.forEach(function(item, index) {
						item(res);
					})
					throw Error("你错了亲")
				}
			}
			
			
			var p1 = new AhfPromise(fn)
			p1.then(res => {
				console.log('你成功了呢');
				console.log(res)
			})
			p1.then(() => {

			})
			p1.catch(res => {
				console.log('菜鸡，你失败了');
				console.log(res)
			})
		</script>
	</body>
</html>

HongfeiAn

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Promise的原理实现--笔记整理

<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> </head> <body> <script type="text/javascript"> var fn = functio...
复制链接

扫一扫