Promise解析

1、按照用途来解释：

• 用于异步计算
• 可以将异步操作队列化，按照期望的顺序执行，并返回预期的结果
• 可以在队列之间传递和操作Promise,帮助我们处理队列

2、 为什么会有Promise?

为了解决同步操作的问题

初始化Promise实例：

<script>
	new Promise(
	function(resolve,reject){
		resolve()
		reject()
	}
	).then(function A(){    //成功，下一步
		
	},function B(){			//失败，做响应的处理
		
	})
</script>

注意：
（1）Promise是一个代理对象，它和原先要进行的操作并无直接的关系
（2）通过引入一个回调，避免更多的回调

Promise的三个状态：Promise状态一经改变，不会改变
· pending 初始状态
· fulfilled 操作成功
· rejected 操作失败

3、例子

(1)最简单的Promise实例（定时器）

<script>
	console.log('aaaa');
	new Promise(resolve=>{
		setTimeout(()=>{
			resolve('name:')
		},2000)
	}).then(value=>{
		console.log(value+'张三')
	})
</script>

（2）两步执行的例子

<script>
	console.log('aaaa');
	new Promise(resolve=>{
		setTimeout(()=>{
			resolve('name:')
		},2000)
	}).then(value=>{
		console.log(value);
		return new Promise(resolve=>{
			setTimeout(()=>{
				resolve('world')
			},2000)
		});
	}).then(value=>{
		console.log(value+'world1')
	})
</script>

（3）对已完成的promise执行then

<script>
	console.log('aaa');
	let promise=new Promise(resolve=>{
		setTimeout(()=>{
			console.log('the promise fulfilled');
			resolve('bbb');
		},1000)
	});
	setTimeout(()=>{
		promise.then(value=>{
			console.log(value);
		})
	},3000)
</script>

（4）在.then()的函数里面不返回新的Promise

<script>
	console.log('aaa');
	new Promise(resolve=>{
		setTimeout(()=>{
			resolve('bbb')
		},2000);
	}).then(value=>{
		console.log(value);
		console.log('everyone');
		(function(){
			return new Promise(resolve=>{
				setTimeout(()=>{
					console.log('ccc')
					resolve('ddd')
				},2000);
			});
		}());
		return false;
	})
	.then(value=>{
		console.log(value+'eee')
	})
</script>

（5）then的嵌套

<script>
	console.log('aaa');
	new Promise(resolve=>{
		console.log('step 1');
		setTimeout(()=>{
			resolve(100);
		},1000);
	}).then(value=>{
		return new Promise(resolve=>{
			console.log('step-1-1')
			setTimeout(()=>{
				resolve(110);
			},1000);
		})
		.then(value=>{
			console.log('step 1-2');
			return value;
		})
		.then(value=>{
			console.log('step 1-3');
			return value;
		})
	})
	.then(value=>{
		console.log(value);
		console.log('step 2')
	})
</script>

4、面试题

（1）面试题1

setTimeout(()=>{
		console.log(1)
	},0)
	Promise.resolve().then(()=>{
		console.log(2)
	})
	Promise.resolve().then(()=>{
		console.log(3)
	})
	console.log(4)

（2）面试题2

<script>
	setTimeout(()=>{
		console.log(1)
	},0)
	new Promise((resolve)=>{
		console.log(2)
		resolve()
	}).then(()=>{
		console.log(3)
	}).then(()=>{
		console.log(4)
	})
	console.log(5)
</script>

(3)面试题3

<script>
	setTimeout(()=>{
		console.log("0")
	},0)
	new Promise((resolve,reject)=>{
		console.log("1")
		resolve()
	}).then(()=>{
		console.log("2")
		new Promise((resolve,reject)=>{
			console.log("3")
			resolve()
		}).then(()=>{
			console.log("4")
		}).then(()=>{
			console.log("5")
		})
	}).then(()=>{
		console.log("6")
	})
	
	new Promise((resolve,reject)=>{
		console.log("7")
		resolve()
	}).then(()=>{
		console.log("8")
	})
</script>

4、简单实现Promise

function myPromise(constructor){
    let self=this;
    self.status="pending" //定义状态改变前的初始状态
    self.value=undefined;//定义状态为resolved的时候的状态
    self.reason=undefined;//定义状态为rejected的时候的状态
    function resolve(value){
        //两个==="pending"，保证了状态的改变是不可逆的
       if(self.status==="pending"){
          self.value=value;
          self.status="resolved";
       }
    }
    function reject(reason){
        //两个==="pending"，保证了状态的改变是不可逆的
       if(self.status==="pending"){
          self.reason=reason;
          self.status="rejected";
       }
    }
    //捕获构造异常
    try{
       constructor(resolve,reject);
    }catch(e){
       reject(e);
    }
}