Promise(三)

1. 事件循环和 Promise

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/EventLoop

https://zhuanlan.zhihu.com/p/33058983

const s = new Date().getSeconds();
console.log(s);
setTimeout(function () {
  // 输出 "2"，表示回调函数并没有在 500 毫秒之后立即执行
  console.log("s is : " + s);
  console.log("Ran after " + (new Date().getSeconds() - s) + " seconds");
}, 500);

console.log("after setTimeout...");

while (true) {
  //   console.log("loop...");
  if (new Date().getSeconds() - s >= 2) {
    console.log("Good, looped for 2 seconds");
    break;
  }
}

// 23
// after setTimeout...
// Good, looped for 2 seconds
// s is : 23
// Ran after 2 seconds

在上面的例子中，while 循环一直在占用消息队列，直到 2 秒之后循环结束，此时 setTimeout 的 500ms 早已到期，所以立即执行，输出 2。

const promise = new Promise(function (resolve, reject) {
   setTimeout(function () {
    console.log("hello");
  }, 0);
	resolve("ok");
  console.log("end");
});

promise.then(function (value) {
  console.log(value);
});

// end
// ok
// hello

在这个例子中，即使 setTimeout 的 delay 设置为 0，resolve 还是先于 setTimeout 执行。

2. return Promise.reject(error);

axios 的 request 和 response 的拦截器经常这么写，其实就是对一个错误进行抛出，和 throw 效果一样，需要在接下来的 catch 中进行捕获。

let foo = new Promise((resolve, reject) => {
  reject('hwhw');
});
foo
  .then(
    (res) => {
      console.log('then...');
      console.log(res, x);
    },
    (error) => {
      console.log('then--error...');
      console.log(error);
      // return Promise.reject(error + 'again'); // 和下面的 new Error 作用一样，都是被 catch 捕获
      throw new Error(error + 'again2');
    }
  )
  .catch((error) => {
    console.log('catch...');
    console.log(error.message);
  });