手写一个promise
•Promise存在三个状态（state）pending、fulfilled、rejected
•pending（等待态）为初始态，并可以转化为fulfilled（成功态）和rejected（失败态）
•成功时，不可转为其他状态，且必须有一个不可改变的值（value）
•失败时，不可转为其他状态，且必须有一个不可改变的原因（reason）
• new Promise((resolve, reject)=>{resolve(value)}) resolve为成功，接收参数value，状态改变为fulfilled，不可再次改变。
• new Promise((resolve, reject)=>{reject(reason)}) reject为失败，接收参数reason，状态改变为rejected，不可再次改变。
我门常常用到 new Promise().then().then() ,这就是链式调用，用来解决回调地狱，为了达成链式，我们默认在第一个then里返回一个promise，就是在then里面返回一个新的promise,称为promise2： promise2 = new Promise1((resolve, reject)=>{})
•将这个promise2返回的值传递到下一个then中
•如果返回一个普通的值，则将普通的值传递给下一个then中
当我们在第一个then中 return 了一个参数（参数未知，需判断）。这个return出来的新的promise就是onFulfilled()或onRejected()的值，onFulfilled()或onRejected()的值，即第一个then返回的值，叫做x，判断x的函数叫做resolvePromise
function Promise1(executor){
let self=this;
self.status='pending'//给promise设置初始状态pending；
self.onfulfilledList=[];//用来订阅then中成功的回调onfulfilled
self.onrejectedList=[];//用来订阅then中失败的回调onrejected
try{
executor(resolve,reject);//执行传入promise的这个回调函数executor,
//并传入resolve,reject这两个函数作为实参。
}catch(err){
reject(err);//如果执行executor抛出错误，那就进入失败状态。
}
//定义resolve reject这两个函数
function resolve(value){//接受一个参数value
if(self.status=='pending'){
//只有当promise的状态是pending时调用resolve才会进行状态的改变
self.status='fulfilled';//调用resolve表示成功，状态变为fulfilled
self.value=value//将值挂载到promise上，用于then的onfulfilled中拿到value；
self.onfulfilledList.forEach(function(fn){//逐个执行成功态then中添加的回调
fn();
})
}
}
function reject(reason){
if(self.status=='pending'){
self.status='rejected'//调用reject表示失败，状态变为rejected
self.reason=reason//把失败的原因挂载到promise上，方便then的onrejected拿到reason
self.onfulfilledList.forEach(function(fn){//逐个执行失败态then中添加的回调
fn();
})
}
}
}
Promise1.prototype.then=function(onfulfilled,onrejected){
let self=this;
let promise2=new Promise1(function(resolve,reject){//返回这个promise对象
//这个新的对象需要做的有判断当前的状态
//判断then的onfulfilled的参数类型，onrejeced中拿到的参数的类型
//如果then中的参数不是一个函数的话，那么promise中的value或reason就继续向下一个then传递
//如果then的回调中返回的是一个普通对象那么就继续向下一个then传递
//如果返回的是一个promise对象那么这个promise对象就作为下一个then的promise使用覆盖promise2;
if(typeof onfulfilled !=='function'){//如果不是函数就将value向下传递数据
onfulfilled=function(value){
return value;
}
}
if(typeof onrejected!=='function'){//如果不是函数就将reason向下传递数据
onrejected=function(reason){
return reason;
}
}
if(self.status=='fulfilled'){//成功状态
setTimeout(function(){//计时器异步的另一个作用是能让promise2对象能在promise2中正确引用
try{
let x=onfulfilled(self.value);//拿到onfulfilled的返回值
resolvePromise(promise2,x,resolve,reject);//这个函数用来判断以上then的返回值，以处理then向下传递的状态走resolve函数还是reject函数
}catch(e){
//抛出错误就返回错误
reject(e);
}
},0);
}
if(self.status=='rejected'){//失败状态
setTimeout(function(){
try{
let x=onrejected(self.reason);//拿到onrejected的返回值
resolvePromise(promise2,x,resolve,reject);
}catch(e){
//抛出错误就返回错误
reject(e);
}
},0)
}
if(self.status=='pending'){//等待状态
self.onfulfilledList.push(function(){
setTimeout(function(){//计时器异步的另一个作用是能让promise2对象能在promise2中正确引用
try{
let x = onfulfilled(self.value);//拿到onfulfilled的返回值
resolvePromise(promise2, x, resolve, reject);
}catch(e){
reject(e)
}
},0)
})
self.onrejectedList.push(function(){
setTimeout(function(){
try{
let x = onrejected(self.reason);//拿到onrejected的返回值
resolvePromise(promise2, x, resolve, reject);
}catch(e){
reject(e);
}
},0)
})
}
})
return promise2;
}
//处理then回调中x返回值的状态
function resolvePromise(promise2,x,resolve,reject){
if(promise2 === x){//如果then回调中返回的x和promise2是一个就会陷入死循环
return reject(new Error('死循环'))
}
let changeFlag;//用来做状态标识，如果状态改变后，就不再改变
if((x!=null)&&(typeof x=='object'||typeof x=='function')){//判断x的类型函数或对象
try{
let then = x.then;
//之所以用then取值而不使用x.then的原因是：避免多次取值造成不必要的错误(代码更加严谨)
//Object.definedProperty(x,then,{get(){处理取值结果，改变不同的值}})；
if(typeof then == 'function'){//说明x有then方法
then.call(x,function(y){
//resolve(value)不是应该向下传递应该继续判断下一个then的返回值类型
if(!changeFlag){changeFlag=true}else{return}
resolvePromise(x,y,resolve,reject)//递归判断
//避免返回的promise中依然返回的是promise，把所有嵌套的promise都执行，直到返回普通值
},function(reason){
if(!changeFlag){changeFlag=true}else{return}
reject(reason);
})
}else{//不是一个promise，是个普通的对象，数据向下传递
resolve(x)
}
}catch(e){
if(!changeFlag){changeFlag=true}else{return}
reject(e)
}
}else{//说明返回的是普通值，向下传递
resolve(x)
}
};
//resolve方法
Promise1.resolve = function(val){
return new Promise1((resolve,reject)=>{
resolve(val)
});
}
//reject方法
Promise1.reject = function(val){
return new Promise1((resolve,reject)=>{
reject(val)
});
}
//race方法
Promise1.race = function(promises){
return new Promise1((resolve,reject)=>{
for(let i=0;i<promises.length;i++){
promises[i].then(resolve,reject)
};
})
}
//all方法(获取所有的promise，都执行then，把结果放到数组，一起返回)
Promise1.all = function(promises){
let arr = [];
let j = 0;
return new Promise1((resolve,reject)=>{
for(let i=0;i<promises.length;i++){
promises[i].then(data=>{
processData(i,data);
},reject);
};
function processData(index,data){
arr[index] = data;
j++;
if(j == promises.length){
resolve(arr);
};
};
});
}
//测试链式调用
let p= new Promise1((resolve, reject) => {
setTimeout(() => {
resolve({ test: 1 })
}, 1000)
}).then((data) => {
console.log('result1', data)
return new Promise1((resolve, reject) => {
setTimeout(() => {
resolve({ test: 2 })
}, 1000)
})
})
.then((data) => {
console.log('result2', data)
return { test: 3 }
})
.then((data) => {
console.log('result3', data)
})
//测试Promise1.race
let a= new Promise1((resolve, reject) => {
setTimeout(() => {
resolve('a完成了')
}, 2500)
})
let b= new Promise1((resolve, reject) => {
setTimeout(() => {
resolve('b完成了')
}, 3000)
})
Promise1.race([a,b]).then((data) => {
console.log(data)
})
//测试Promise1.all
Promise1.all([a,b]).then((data) => {
console.log(data)
})
