Promise的实现原理(一)

98 阅读2分钟

1.先说一下用法,根据用法来一步步实现;

1.1 简单使用

// 传如一个函数,函数里有两个参数,resolve,reject
	new Promise((resolve,reject)=>{
		// 成功就调用
		resolve()
	})

1.1.1 来实现我们自己的Mypromise

class Mypromise {
	// executor 执行者,也就是调用方传过来的函数,他是立即执行的,所有说new Promise 是一个同步的
	constructor(executor){
		// 状态设置,因为promise 的状态是一旦改变就不允许返回的,我们已0为初始化状态
	this.stateus = 0;
		// executor又有两个回调函数,一个成功的函数resolve,一个失败的状态reject,首先定义这两个函数
		// 使用者传回成功的value值
		const resolve = (value)=>{
			// 因为promise 的状态是不可逆的,因此这里需要更改status 的状态值
			// 用户在.then 的时候,需要在把value值返回给用户,因此要把value暂存一下
			this.successValue = value;
			this.stateus=1;
		}
		// 使用者传回失败的value值
		const reject= (value)=>{
			// 同上
			this.errorValue = value;
			this.stateus=2;
		}
		executor(resolve,reject);

	}
}

2.用户调用.then 方法 2.1 简单使用

new Promise((resolve,reject)=>{
	resolve('成功');
})

2.1.1 原理实现

class Mypromise {
	// executor 执行者,也就是调用方传过来的函数,他是立即执行的
	constructor(executor){
			// 状态设置,因为promise 的状态是一旦改变就不允许返回的,我们已0为初始化状态
		this.status = 0;
		// executor又有两个回调函数,一个成功的函数resolve,一个失败的状态reject,首先定义这两个函数
		// 使用者传回成功的value值
		const resolve = (value)=>{
			// 因为promise 的状态是不可逆的,因此这里需要更改status 的状态值
			// 用户在.then 的时候,需要在把value值返回给用户,因此要把value暂存一下
			this.successValue = value;
			this.stateus=1;
		}
		// 使用者传回失败的value值
		const reject= (value)=>{
			// 同上
			this.errorValue = value;
			this.stateus=2;
		}
		executor(resolve,reject);

	}
	// success,error是用户传过来的回调函数
	then(success,error){
		// 因为promise 是一旦成就不允许失败的,或者一旦失败不允许成功,所以这里要判断一下
		if(this.stateus===1){
			success(this.successValue)
		}
		if(this.stateus===2){
			error(this.errorValue)
		}
	}
}

到这里一个简单版本的promise 已经实现,但是这个代码是同步的,还是会有问题的~ Promise的实现原理(二)会继续实现!

作者:邵明振