Promise

什么是 Promise?

Promise 是 JS 异步编程中的重要概念,异步抽象处理对象,是目前比较流行 Javascript 异步编程解决方案之一

有用过 promise 吗?请写出下列代码的执行结果,并写出你的理解思路:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
setTimeout(() => {
console.log(1);
}, 0);

new Promise((resolve) => {
console.log(2);
for (var i = 1; i < 200; i++) {
i = 198 && resolve();
}
console.log(3);
}).then(() => {
console.log(4);
});
console.log(5);
// 结果:2、3、5、4、1;

首先要讲一下,js 是单线程执行,那么代码的执行就有先后;
有先后,那就要有规则(排队),不然就乱套了,那么如何分先后呢?大体分两种:同步、异步;
同步很好理解,就不用多说了(我就是老大,你们都要给我让路);
异步(定时器[setTimeout ,setInterval]、事件、ajax、promise 等),说到异步又要细分宏任务、微任务两种机制,
宏任务:js 异步执行过程中遇到宏任务,就先执行宏任务,将宏任务加入执行的队列(event queue),然后再去执行微任务;
微任务:js 异步执行过程中遇到微任务,也会将任务加入执行的队列(event queue),但是注意这两个 queue 身份是不一样的,不是你先进来,就你先出去的(就像宫里的皇上选妃侍寝一样,不是你先进宫(或先来排队)就先宠幸的 ),真执行的时候是先微任务里拿对应回调函数,然后才轮到宏任务的队列回调执行的;
理解了这个顺序,那上面的结果也就不难懂了。

说细步骤如下:
setTimeout 是异步,不会立即执行,加入执行队列;
new Promise 会立即执行 输出 2、3,而在 2、3 之间执行了 resolve 也就是微任务;
再到 console.log(5)了,输出 5;
然后异步里的微任务先出,那就得到 4;
最后执行宏任务 setTimeout 输出 1;

promise 有几种状态, Promise 有什么优缺点?

promise 有三种状态: fulfilled, rejected, pending。

Promise 的优点

1 . 一旦状态改变,就不会再变,任何时候都可以得到这个结果;
2 . 可以将异步操作以同步操作的流程表达出来,避免了层层嵌套的回调函数。

Promise 的缺点

  1. 无法取消 Promise;
  2. 当处于 pending 状态时,无法得知目前进展到哪一个阶段。

Promise 构造函数是同步还是异步执行,then 呢 ?promise 如何实现 then 处理?

Promise 的构造函数是同步执行的。then 是异步执行的。
promise 的 then 实现,详见: Promise :[源码实现][1]
[1]: https://juejin.im/post/5c88e427f265da2d8d6a1c84

Promise 和 setTimeout 的区别?

Promise 是微任务,setTimeout 是宏任务,同一个事件循环中,promise.then 总是先于 setTimeout 执行。同一个事件循环中,promise.then 先于 setTimeout 执行。