promise 特性

1、promise 有三个状态： 成功态（resolve） 失败态（reject） 等待态（pending） (又不成功又不失败)

2、es6 规范中提供的一个类，每个Promise中内置一个executor执行器，该方法立即执行

3、默认的Promise状态为PENDING，如果一旦变为RESOLVE，则不能改变，反之也一样

4、new Promise之后会产生一个promise实例，这个实例上存在一个then方法

5、成功或失败的原因都是由用户传入的，传入之前为undefined

5、executor中需要提供一个成功的方法和一个失败的方法（不挂载在promise实例上，挂载实例上的只有promise.then）

promise 优缺点

1、多个异步方法串行问题 链式调用 （基于回调）
2、多个异步方法并发问题 同时拿到 多个异步的执行结果 Promise.all
3、缺陷：基于回调函数的

Promise 简易版

简易版用法

let promise = new Promise((resolve, reject) => {
  resolve('成功');
  // throw new Error('异常')
})
promise.then((data) => {
  console.log('success', data)
}, (err) => {
  console.log('faild', err)
})

Promise 简易版

const PENDING = 'PENDING';
const RESOLVED = 'RESOLVED';
const REJECTED = 'REJECTED';

class Promise{
  constructor(executor){
    this.status = PENDING;
    this.value = undefined;
    this.reason = undefined;
    
    let resolve = (value) => {
      if(this.status === PENDING) {
        this.status = RESOLVED;
        this.value = value;
      }
    }
    let reject = (reason) => {
      if(this.status === PENDING) {
        this.status = REJECTED;
        this.reason = reason;
      }
    }
    try{
      executor(resolve, reject); // 立即执行
    } catch(e) {
      reject(e)
    }
  }
  then(onFulfilled, onRejected) {
    if(this.status == RESOLVED) onFulfilled(this.value)
    if(this.status == REJECTED) onRejected(this.reason)
  }
}

PromiseA+ 完整版

promise掺杂定时器，异步任务用法

• promise调用then方法时可能当前的Promise并没有成功，而是pending状态
• 发布订阅模式 如果当前状态是pending时，我们需要将成功的回调和失败的回调存放起来

let promise = new Promise((resolve, reject) => {
  setTimeout(_ => {
    resolve('成功');
  }, 1000)
})
promise.then((data) => {
  console.log('success', data)
}, (err) => {
  console.log('faild', err)
})

promise.then((data) => {
  console.log('success2', data)
}, (err) => {
  console.log('faild2', err)
})

PromiseA+ 完整版

const PENDING = 'PENDING';
const RESOLVED = 'RESOLVED';
const REJECTED = 'REJECTED';

class Promise{
  constructor(executor){
    this.status = PENDING;
    this.value = undefined;
    this.reason = undefined;
    this.onResolvedCallbacks = []; // 存储成功时需要执行的回调函数
    this.onRejectedCallbacks = []; // 存储失败时需要执行的回调函数
    
    let resolve = (value) => {
      if(this.status === PENDING) {
        this.status = RESOLVED;
        this.value = value;
        // 将 pending状态时，存储的成功的回调 依次执行
        this.onResolvedCallbacks.forEach( fn => fn()); 
      }
    }
    let reject = (reason) => {
      if(this.status === PENDING) {
        this.status = REJECTED;
        this.reason = reason;
        this.onRejectedCallbacks.forEach( fn => fn());
      }
    }
    try{
      executor(resolve, reject); // 立即执行
    } catch(e) {
      reject(e)
    }
  }
  then(onFulfilled, onRejected) {
    if(this.status == RESOLVED) onFulfilled(this.value)
    if(this.status == REJECTED) onRejected(this.reason)
    if(this.status == PENDING) {
      this.onResolvedCallbacks.push(_ => {
        // todo...
        onFulfilled(this.value);
      })
      this.onRejectedCallbacks.push(_ => {
        // todo...
        onRejected(this.reason);
      })
    }
  }
}