Promise简单实现

782 阅读2分钟

1.promise 构造函数

function Promise(executor) {
  // 缓存当前promise实例子
  let self = this;  
  self.status = "pending";
  self.value = undefined;
  // 定义存放成功回调的数组
  self.onResolvedCallbacks = [];
  // 定义存放失败回调的数组
  self.onRejectedCallbacks = [];
  function resolve(value) {
    if (value instanceof Promise) {
      return value.then(resolve, reject)
    }
       // 异步执行所有的回调函数
      if (self.status == 'pending') {
        self.value = value; // 成功后赋值
        self.status = 'resolved';
        // 调用所有成功的回调
        self.onResolvedCallbacks.forEach(item => item(value));
      }
    });

  }

  function reject(value) {
    setTimeout(function () {
      if (self.status == 'pending') {
        self.value = value;
        self.status = 'rejected';
        // 调用所有失败的回调
        self.onRejectedCallbacks.forEach(item => item(value));
      }
    });
  }

  try {
    // 处理函数执行时的异常
    executor(resolve, reject);
  } catch (e) {
   // 处理错误对象
    reject(e);
  }
}

2.对promise的处理函数

function resolvePromise(promise2, x, resolve, reject) {
  if (promise2 === x) {
    return reject(new TypeError('循环引用'));
  }
  let then, called;

  if (x != null && ((typeof x == 'object' || typeof x == 'function'))) {
    try {
      then = x.then;
      if (typeof then == 'function') {
        then.call(x, function (y) {
          if (called)return;
          called = true;
          resolvePromise(promise2, y, resolve, reject);
        }, function (r) {
          if (called)return;
          called = true;
          reject(r);
        });
      } else {
        resolve(x);
      }
    } catch (e) {
      if (called)return;
      called = true;
      reject(e);
    }
  } else {
    resolve(x);
  }
}

3.promise的then方法实现

Promise.prototype.then = function (onFulfilled, onRejected) {
  let self = this;
  // 如果onFulfilled或者onRejected不是函数的话 给一个函数,返回当前promise resolve的值
  onFulfilled = typeof onFulfilled == 'function' ? onFulfilled : function (value) {
    return value
  };
  onRejected = typeof onRejected == 'function' ? onRejected : function (value) {
    throw value
  };
  let promise2; 
  if (self.status == 'resolved') {
     promise2  = new Promise(function (resolve, reject) {
      setTimeout(function () {
        try {
          let x = onFulfilled(self.value);
          // 如果返回了值x 会解析promise
          resolvePromise(promise2, x, resolve, reject);
        } catch (e) {
          reject(e);
        }
      });   

    });
  }
  if (self.status == 'rejected') { 
    promise2 = new Promise(function (resolve, reject) {
      setTimeout(function () {
        try {
          let x = onRejected(self.value);
          resolvePromise(promise2, x, resolve, reject);
        } catch (e) {
          reject(e);
        }
      });
    });
  }
  if (self.status == 'pending') {
    promise2 = new Promise(function (resolve, reject) {
      self.onResolvedCallbacks.push(function (value) {
        try {
          let x = onFulfilled(value);
          resolvePromise(promise2, x, resolve, reject);
        } catch (e) {
          reject(e);
        }
      });
      self.onRejectedCallbacks.push(function (value) {
        try {
          let x = onRejected(value);
          resolvePromise(promise2, x, resolve, reject);
        } catch (e) {
          reject(e);
        }
      });
    });
  }
  return promise2;
}
Promise.prototype.catch = function (onRejected) {
  return this.then(null, onRejected);
}

4.promise的all方法实现

参数:接受一个数组,数组内都是Promise实例
返回值:返回一个Promise实例,这个Promise实例的状态转移取决于参数的Promise实例的状态变化。当参数中所有的实例都处于resolve状态时,返回的Promise实例会变为resolve状态。如果参数中任意一个实例处于reject状态,返回的Promise实例变为reject状态
Promise.all = function (promises) {
  return new Promise(function (resolve, reject) {
    let result = [];
    let count = 0;
    for (let i = 0; i < promises.length; i++) {
      promises[i].then(function (data) {
        result[i] = data;
        if (++count == promises.length) {
          resolve(result);
        }
      }, function (err) {
        reject(err);
      });
    }
  });
}

5.promise的race方法实现

参数:接受一个数组,数组内都是Promise实例
返回值:返回一个Promise实例,这个Promise实例的状态转移取决于参数的Promise实例的状态变化。当参数中任何一个实例处于resolve状态时,返回的Promise实例会变为resolve状态。如果参数中任意一个实例处于reject状态,返回的Promise实例变为reject状态。
Primise.race = function(promises){
  new Promise(function (resolve, reject) {
    for (let index = 0; index < promises.length; index++) {
      promises[i].then(resolve, reject)
    }
  })
}

6.promise的resolve方法实现

Primise.resolve = function(value){
  return new Promise(function (resolve, reject) {
    resolve(value)
  })
}

7.promise的reject方法实现

Primise.reject = function(value){
  return new Promise(function (resolve, reject) {
    reject(value)
  })
}