前端_Promise面试题 3

题目一

Promise.then()返回的新Promise的结果状态由什么决定？
1、简单表达：由then()指定的回调函数执行的结果决定。
2、详细表达：
      ①如果抛出异常，新Promise变为rejected，reason为抛出的异常。
      ②如果返回的是非Promise的任意值，新Promise变为resolved，value为返回的值。
      ③如果返回的是另一个新的Promise，此Promise的结果就会成为新Promise的结果。

    new Promise((resolve, reject) => {
      resolve(1)
    }).then(
      value => {
        console.log('onResolved1()', value)
        // 相当于return undefined
      },
      reason => {
        console.log('onRejected1()', reason)
      }
    ).then(
      value => {
        console.log('onResolved2()', value)
      },
      reason => {
        console.log('onRejected2()', reason)
      }
    )

 

---

    new Promise((resolve, reject) => {
      reject(1)
    }).then(
      value => {
        console.log('onResolved1()', value)
      },
      reason => {
        console.log('onRejected1()', reason)
        // 相当于return undefined
      }
    ).then(
      value => {
        console.log('onResolved2()', value)
      },
      reason => {
        console.log('onRejected2()', reason)
      }
    )

 

---

    new Promise((resolve, reject) => {
      resolve(1)
    }).then(
      value => {
        console.log('onResolved1()', value)
        return 2
      },
      reason => {
        console.log('onRejected1()', reason)
      }
    ).then(
      value => {
        console.log('onResolved2()', value)
      },
      reason => {
        console.log('onRejected2()', reason)
      }
    )

 

---

    new Promise((resolve, reject) => {
      resolve(1)
    }).then(
      value => {
        console.log('onResolved1()', value)
        return Promise.resolve(2)
      },
      reason => {
        console.log('onRejected1()', reason)
      }
    ).then(
      value => {
        console.log('onResolved2()', value)
      },
      reason => {
        console.log('onRejected2()', reason)
      }
    )

 

---

    new Promise((resolve, reject) => {
      resolve(1)
    }).then(
      value => {
        console.log('onResolved1()', value)
        return Promise.reject(2)
      },
      reason => {
        console.log('onRejected1()', reason)
      }
    ).then(
      value => {
        console.log('onResolved2()', value)
      },
      reason => {
        console.log('onRejected2()', reason)
      }
    )

 

---

    new Promise((resolve, reject) => {
      resolve(1)
    }).then(
      value => {
        console.log('onResolved1()', value)
        throw 2
      },
      reason => {
        console.log('onRejected1()', reason)
      }
    ).then(
      value => {
        console.log('onResolved2()', value)
      },
      reason => {
        console.log('onRejected2()', reason)
      }
    )

 

---

题目二

Promise如何串连多个操作任务？
1、Promise的then()返回一个新的Promise,可以看成是then()的链式调用
2、通过then()的链式串连多个同步/异步任务

    new Promise((resolve, reject) => {
      setTimeout(() => {
        console.log('执行任务1(异步)');
        resolve(1)
      }, 1000);
    }).then(
      value => {
        console.log('任务1的结果:', value);
        console.log('执行任务2(同步)');
        return 2
      }
    ).then(
      value => {
        console.log('任务2的结果:', value);
        return new Promise((resolve, reject) => {
          // 启动任务3(异步)
          setTimeout(() => {
            console.log('执行任务3(异步)');
            resolve(3)
          }, 1000);
        })
      }
    ).then(
      value => {
        console.log('任务3的结果:', value);
      }
    )

 

---

题目三

Promise异常穿透？
1、当使用Promise的then链式调用时，可以在最后指定失败的回调
2、前面任何操作出了异常，都会传到最后失败的回调中处理

    new Promise((resolve, reject) => {
      reject(1)
    }).then(
      value => {
        console.log('onResolved1()', value);
        return 2
      },
      // 默认写了
      // reason => {throw reason}
      // 相当于
      // reason => Promise.reject(reason)
    ).then(
      value => {
        console.log('onResolved2()', value);
        return 3
      },
      // 默认写了
      // reason => {throw reason}
      // 相当于
      // reason => Promise.reject(reason)
    ).catch(
      reason => {
        console.log('onRejected1()', reason);
      }
    )

---

题目四

中断Promise链？
1、当使用Promise的then链式调用时，在中间中断，不在调用后面的回调函数。
2、办法：在回调函数中返回一个pending状态的Promise对象。

    new Promise((resolve, reject) => {
      reject(1)
    }).then(
      value => {
        console.log('onResolved1()', value);
        return 2
      },
    ).catch(
      reason => {
        console.log('onRejected1()', reason);
        return new Promise(() => {}) // 返回一个pending的Promise就可以中断
      }
    ).then(
      value => {
        console.log('onResolved()', value);
      },
      reason => {
        console.log('onRejected()', reason);
      }
    )