Promise

源哥的promise代码

MDN

Promise底层代码，核心可看258行
https://github.com/zloirock/core-js/blob/master/packages/core-js/modules/es.promise.js

 Internal.prototype = redefineAll(PromiseConstructorPrototype, {
    // `Promise.prototype.then` method
    // https://tc39.es/ecma262/#sec-promise.prototype.then
    then: function then(onFulfilled, onRejected) {
      var state = getInternalPromiseState(this);
      // newPromiseCapability 把onFulfilled方法封装成一个自带promise属性的对象
      var reaction = newPromiseCapability(speciesConstructor(this, PromiseConstructor));
      reaction.ok = typeof onFulfilled == 'function' ? onFulfilled : true;
      reaction.fail = typeof onRejected == 'function' && onRejected;
      reaction.domain = IS_NODE ? process.domain : undefined;
      state.parent = true;
      state.reactions.push(reaction);
      if (state.state != PENDING) notify(state, false);
      //如果不做任何操作，则在最后返回一个全新的promise，跟上次promise有不清楚的关系，因为传this了
      return reaction.promise;
    },
    // `Promise.prototype.catch` method
    // https://tc39.es/ecma262/#sec-promise.prototype.catch
    'catch': function (onRejected) {
      return this.then(undefined, onRejected);
    }
  });

p = new Promise((resolve,reject) => {
        resolve("success")
    }).then( str => {
        console.log(str)
    }).then(function(obj){
        console.log(typeof obj === 'undefined')
        //此处的this等于p.then返回的promise
        // p等于 p.then.then返回的pomise
        console.log(this === p)
    })
success
true   //obj === 'undefined' 因为虽然返回了Promise,但是没有参数
false
Promise {<fulfilled>: undefined}
[[Prototype]]: Promise
[[PromiseState]]: "fulfilled"
[[PromiseResult]]: undefined

core-js

  Internal.prototype = redefineAll(PromiseConstructorPrototype, {
    // `Promise.prototype.then` method
    // https://tc39.es/ecma262/#sec-promise.prototype.then
    then: function then(onFulfilled, onRejected) {
      var state = getInternalPromiseState(this);
      var reaction = newPromiseCapability(speciesConstructor(this, PromiseConstructor));
      reaction.ok = typeof onFulfilled == 'function' ? onFulfilled : true;
      reaction.fail = typeof onRejected == 'function' && onRejected;
      reaction.domain = IS_NODE ? process.domain : undefined;
      state.parent = true;
      state.reactions.push(reaction);
      if (state.state != PENDING) notify(state, false);
      return reaction.promise;
    },
    // `Promise.prototype.catch` method
    // https://tc39.es/ecma262/#sec-promise.prototype.catch
    'catch': function (onRejected) {
      return this.then(undefined, onRejected);
    }

   //因为catch === this.then(undefined, onRejected);
   //所以catch下面能一直.then 

   再来个例子：
promise = new Promise(function(resolve, reject) {
  console.log('Promise');
  reject(1); 
}).then(undefined,res =>{
    console.log(res)
  //不return或者return undefined == return一个fulfilled状态的promise
  //(虽然是成功状态，但是里面没有参数) 可以无限.then()
})


// !!此时 下面的代码块就等于 .catch
.then(undefined,res =>{
    console.log(res)
})
//因为
'catch': function (onRejected) {
    return this.then(undefined, onRejected);
 }

案例

let p = new Promise((resolve,reject) => {
        resolve("success")
    }).then( str => {
        console.log(str)
    }).then(function(obj){
        console.log(1)
        return Promise  
        // 如果上一行不renturn 东西，只要不报错，不返回错误状态的promise 
        // 就等于返回一个新的没有传值的promse
    }).then(function(obj){
        console.log(2)
    }).then(function(obj){
        
    }).then(function(obj){
        
    })
success
1
2 

let p = new Promise((resolve,reject) => {
        resolve("success")
    }).then( str => {
        console.log(str)
    }).then(function(obj){
        console.log(1)
        return new Promise(() => {
            //此处一直处于padding状态 所以也不会向下执行
        })
        //不传参数报错，Promise解析器未定义不是一个函数
        //Promise resolver undefined is not a function
    }).then(function(obj){
        console.log(2)
    })
    setTimeout(() => {
        console.log(p)
    }, 1000);
success
1
Promise {<pending>}   //一直处于pending状态的promise
[[Prototype]]: Promise
[[PromiseState]]: "pending"
[[PromiseResult]]: undefined

let p = new Promise((resolve, reject) => {
        resolve("success")
    }).then(() => {
        console.log(1)
    }).then(() => {
        console.log(2)
        return Promise.reject("error")
    }).then(() => {
        console.log(3)
    }).catch(error => {
        console.log(error)
    }).

    // !!!上下同理!!!

    let p = new Promise((resolve, reject) => {
        resolve("success")
    }).then(() => {
        console.log(1)
    }).then(() => {
        console.log(2)
        throw "error"
    }).then(() => {
        console.log(3)
    }).catch(error => {
        console.log(error)
    })

总结

1. promise.then (只要不返回错误状态的promise 、抛出错误、返回一直pending的promise)
    他能一直then下去
2. 可以用返回错误状态的promise 、抛出错误、返回一直pending的promise 打断promise的执行，例子见上面三个案例
3. promise.catch 等于执行.then里面的onRejected方法,返回的是一个全新的promise 
   详情可见core-js 他只是给reaction.fail赋值，返回的还是reaction.promise

还没写完，持续更新，立个flag 本周写完8.16