JavaScript高级手记（简单实现Promis）

JavaScript高级手记（简单实现Promis）

// 实现Promise
function _Promise(fn){
  // 要求接收的fn必须是一个函数，否则报错
  if(typeof fn !== 'function') {
    throw new TypeError('_Promise resolver undefined is not a function')
  }
  // 每个实例应该有这两个属性：state，result
  this.state = 'pending'; // 初始状态为 pending
  this.result = undefined;  // 初始结果为 undefined

  // 事件池(自定义)：这里存放的是then中传递的A函数和B函数
  this.eventPool = {
    A: function(){},
    B: function(){}
  }
  // 立即执行传递进来的fn函数：但是在执行fn的时候得给fn床底两个函数 resolev，reject
  var that = this;
  function resolve(res){ 
    // 这里接收一个参数，作为当前实例的result值
    // 执行这个函数的时候会将当前实例的状态从 pending转为 resolved
    /* if(that.state !== 'pending') return;
    that.state = 'resolved';
    that.result = res; */
    change('resolved', res)
  }
  function reject(rej){
    // 这里接收一个参数，作为当前实例的result值
    // 执行这个函数的时候会将当前实例的状态从 pending转为 rejected
   /*  if(that.state !== 'pending') return;
    that.state = 'rejected';
    that.result = rej; */
    change('rejected', rej)
  }
  // resolve函数和reject函数代码冗余，整合成一个
  function change(state, result){
    // 如果状态已经不是初始状态了，则直接退出，否则改变其状态和结果，并同时事件池中对应的函数执行
    if(that.state !== 'pending') return; 
    that.state = state;
    that.result = result;
    // 通知事件执行时异步的
    setTimeout(function(){
      that.state === 'resolved'? that.eventPool.A(that.result): that.eventPool.B(result);
    })
  }
  // 注意：执行fn的时候，如果有报错，则当前实例的状态为失败，值为失败的原因
  try{
    fn(resolve, reject); 
  }catch(err){
    change('rejected', err);
  }
}

// _Promise的原型上有一个then方法，该方法接收两个函数A和B，根据实例的状态自动识别执行A还是B
_Promise.prototype.then = function(A, B){
  // this：当前_Promise的实例
  this.eventPool.A = A;
  this.eventPool.B = B;
}

// 快速创建一个状态为成功的实例
_Promise.resolve = function(res) {
  return new _Promise(function(resolve){
    resolve(res)
  });
};

// 快速创建一个状态为失败的案例
_Promise.reject = function(res) {
  return new _Promise(function(undefined, rejecte){
    rejecte(res)
  });
};

let p = new _Promise(function(resolve, reject){
  // resolve(200);
  reject(300);
});

p.then(res=>{
  console.log(res);
}, rej=>{
  console.log(rej);
});

_Promise.resolve(200).then(res=>{
  console.log(res)
});

_Promise.reject(400).then(res=>{}, rej=>{
  console.log('失败', rej)
});

console.log('同步');
/* 
 * 输出结果：
           同步
           300
           200
          失败 400
*/