Promise 实现原理

promise 需要实现的功能

function  fn (resolve, reject){
	setTimeout() => {
		if( true ) {
			resolve()
		} else {
			reject()
		}
	})
}

var p1 = new LcPromise(fn) 
p1.then(function(res){
	document.body.style.background = " greenyellow "
	console.log(" 这是成功做的事情 ")
	console.log(res)
})

p1.catch(function(error){
	document.body.style.backfround = " pink "
	console.log(" 这是失败做的事情 ")
	console.log( error) 
})

p1 promise对象发送了 异步操作，必然会有一个未来事件，在未来要执行。这个过程由 传入的函数 fn 执行。 函数 fn里必然需要由成功执行和失败执行 的函数.

1、创建类 构造对象

class LcPromise {
	 constructor (fn){
			 //  将成功的事件函数 集成在successList 数组里 
			this.successList =  []
			//  将成功的事件函数 集成在failList数组里 
			this.failList =  []
			// pengding , fullfilled , rejected
			this.state = " pengding "
			// 传入函数对象，（异步操作的函数内容）
			fn( this.resolveFn.bind(this), this.rejectFn.bind(this))
		}
		
		}
		
		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)
			}
}

构造函数的作用：

• 声明成功函数放置的数组对象
• 声明失败 函数放置的数组对象
• 定义初始化状态
• 调用传入进来执行异步内容的函数( 在未来有成功的结果时 调用传入进去的成功函数，在未来失败时调用传入进去的失败函数）

2. 传入成功或者失败时需要调用的函数

class LcPromise {
	 constructor (fn){
			 //  将成功的事件函数 集成在successList 数组里 
			this.successList =  []
			//  将成功的事件函数 集成在failList数组里 
			this.failList =  []
			// pengding , fullfilled , rejected
			this.state = " pengding "
			// 传入函数对象，（异步操作的函数内容）
			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)
				}
		}
	}

作用： 将成功和失败的函数传入值成功和失败的数组里
定义调用成功和失败的函数

 class LcPromise {
	 constructor (fn){
			 //  将成功的事件函数 集成在successList 数组里 
			this.successList =  []
			//  将成功的事件函数 集成在failList数组里 
			this.failList =  []
			// pengding , fullfilled , rejected
			this.state = " pengding "
			// 传入函数对象，（异步操作的函数内容）
			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 (res);
		}
	}

作用：　
	成功时调用成功数组里的所有函数　,失败时调用失败数组里所有函数

应用：
如何将promise 与 async 和 await 结合使用
典型异步读写的回调操作
（转化成 promise对象）

new Promise(function(resolve,reject){
	fs.readFile(path,{flag: 'r', encoding: "utf-8"}, function(err, data) {
		if(err){
			reject(err)
		}else{
			resolve(data)
		}
	})
})

进一步封装

function fsRead (path){
  return  new Promise(function(resolve,reject){
				fs.readFile(path,{flag: 'r', encoding: "utf-8"}, function(err, data) {
						if(err){
							reject(err)
						}else{
							resolve(data)
						}
				})
		})
}

使用时就可以使用promise 写法

p1 = fsRead(path) // 就可以 得到promise 对象
p1.then( function (data) {
	 console.log(" 输出数据 ", data)
	 })

 async await 写法

 (async () => { 
 	let  p1 =  await fsRead(path)
 }) ()

异步 async 函数 调用之后也是一个 promise 对象

(async () => { 
		 async function test () {
	 		let data = await fsRead(path)
	 			return data;
	 		}
	 		let  p =  test()          // p 是一个promise 对象
			p.then(function(data){
				console.log(data)
			})
	 		let a = await  test()     //  异步函数 调用之后 ， 也是一个 promise 对象
	 	
 }) ()