Promise 的不完全试坑记录

Promise

主要就是记忆一下关于 Promise 的一些不太好理解的问题

当在 resolve 或者 reject 的代码问题

list:

• 当已经 resolve 后代码是否会执行

  new Promise((resolve, reject) => {
    resolve(233);
    console.log('ahhh');
  })
  .then(data => console.log(data));
  
  //ahhh
  //2333
  
  

  答案是会运行。

• 当已经 resolve 后有同步的错误是否会抛出

  new Promise((resolve, reject) => {
    resolve(233);
    JSON.parse('[22342343423');
  })
  .catch(err => console.log(err));
  
  // no result;
  

  结果是并不会有任何错误显示

• 当已经 resolve 后再进行 resolve 或者 reject 是否会有什么变化

  new Promise((resolve, reject) => {
    resolve(233);
    resolve(474748484);
    reject('err');
  })
  .then(data => console.log(data))
  .catch(err => console.log(err));
  
  //233
  

  结果是不会有任何变化

• 当已经 resolve 后再有异步代码抛错

  new Promise((resolve, reject) => {
    resolve(233);
    setTimeout(() => JSON.parse('[23313212'), 0);
  })
  .then(data => console.log(data))
  .catch(err => console.log(err));
  
  //233
  //Uncaught SyntaxError: Unexpected end of JSON input
  

  这次异步的抛错会被抛出。并且是在 Promise.then 之后

• 当在 resolve 前有同步出错代码

  new Promise((resolve, reject) => {
    JSON.parse('[23423432');
    console.log(32423423);
    resolve(233);
  })
  .then(data => cosole.log(data))
  .catch(err => console.log(err));
  
  //SyntaxError: Unexpected end of JSON input
  

  catch 捕捉到错误并且不会执行下一句代码

• 当在 resolve 前有异步抛错的代码

  new Promise((resolve, reject) => {
    setTimeout(() => JSON.parse('[2312312'), 0);
    resolve(233);
  })
  .then(data => console.log(data))
  .catch(err => console.log(err));
  
  //233
  //Uncaught SyntaxError: Unexpected end of JSON input
  

  先resolve 然后并不能捕捉到错误

• 当在异步 resolve 之后有错误

  new Promise((resolve, reject) => {
    setTimeout(() => resolve(233), 0);
    JSON.parse('[324234');
  })
  .then(data => console.log(data))
  .catch(err => console.log(err));
  
  //SyntaxError: Unexpected end of JSON input
  

  捕捉到错误并直接不会执行异步的resolve

• 当都为异步时

  new Promise((resolve, reject) => {
    setTimeout(() => resolve(233), 0);
    setTimeout(() => JSON.parse('[43535'), 0);
  })
  .then(data => console.log(data))
  .catch(err => console.log(err));
  
  //233
  //Uncaught SyntaxError: Unexpected end of JSON input
  

  结论是先then 然后再全局的未捕捉错误抛出

• 当都为异步但是顺序不一样时

  new Promise((resolve, reject) => {
    setTimeout(() => resolve(233), 1000);
    setTimeout(() => JSON.parse('[232432'), 0);
  })
  .then(data => console.log(data))
  .catch(err => console.log(err));
  
  //Uncaught SyntaxError: Unexpected end of JSON input
  //233
  

  这里因为两个都为异步的，所以互不会阻塞，所以并不会影响resolve

• 当有阻塞的内容存在时

  new Promise((resolve, reject) => {
    let date = new Date().getTime();
  
    //阻塞 3s
    while((new Date()).getTime() - date < 3000)
  
    resolve(233);
  })
  .then(data => console.log(data));
  
  console.log('ahhh');
  
  //等待 3s
  //ahhh
  //233
  

  会阻塞主线程，并且then 会在下一个事件循环中执行

个人结论： Promise 里面就是一个盒子，然后盒子的运行是同步的，当里面首先返回了 resolve 或者 reject ,然后 这个盒子就不会管后面的运行了，直接返回 resolve 或者 reject 的值，并且改变状态 padding 到 resolved 或者 rejected ；对于异步的而言，因为都是异步的所以不存在会阻塞什么的，所以当在异步里面调用 resolve 或者 reject 会得到返回值，但是异步的其他问题这个就不属于这个盒子管了，这就是下一个事件循环了，盒子在上一个事件中就已经执行完成了，当然因为没有 返回 resolve 或者 reject 所以还处于 padding 状态，会等待其他 reject 或者 resolve 在异步事件的返回。

当然在现在都在用 async await 的时代谈 Promise 略 low, 不过还是希望能明白 Promise 的一些用法，如有不当之处请指出，谢谢。