书接之前代码输出题目，

前端面试题之代码输出

前端面试题之代码输出二

前端面试题之代码输出三

前端面试题之代码输出四

前端面试题之代码输出五

前端面试题之代码输出六

前端面试题之代码输出七

前端面试题之代码输出八

前端面试题之代码输出九

前端面试题之代码输出十

前端面试题之代码输出十一

前端面试题之代码输出十二

前端面试题之代码输出十三

前端面试题之代码输出十四

异步＆事件循环

29.代码输出结果

console.log(1);

setTimeout(() => {
    console.log(2);
    Promise.resolve().then(() => {
        console.log(3)
    });
});

new Promise((resolve, reject) => {
    console.log(4)
    resolve(5)
}).then((data) => {
    console.log(data);
})

setTimeout(() => {
    console.log(6);
})

console.log(7);

输出结果如下：

1
4
7
5
2
3
6

代码执行顺序如下：

1. 首先执行 script 代码，打印出 1；
2. 遇到第一个定时器 setTimeout ，将其加入到宏任务队列；
3. 遇到 Promise ，执行里面的同步代码，打印出 4，遇到 resolve ，将其加入到微任务队列；
4. 遇到第二个定时器 setTimeout ，将其加入到红任务队列；
5. 执行 script 代码，打印出 7，至此第一轮执行完成；
6. 指定微任务队列中的代码，打印出 resolve 的结果：5；
7. 执行宏任务中的第一个定时器 setTimeout ，首先打印出 2，然后遇到 Promise.resolve().then() ，将其加入到微任务队列；
8. 执行完这个宏任务，就开始执行微任务队列，打印出 3；
9. 继续执行宏任务队列中的第二个定时器，打印出 6。

30.代码输出结果

Promise.resolve().then(() => {
    console.log('1');
    throw 'Error';
}).then(() => {
    console.log('2');
}).catch(() => {
    console.log('3');
    throw 'Error';
}).then(() => {
    console.log('4');
}).catch(() => {
    console.log('5');
}).then(() => {
    console.log('6');
});

输出结果如下：

1
3
5
6

代码执行顺序如下：

在这道题目中，我们需要知道，无论是 then 还是 catch 中，只要 throw 抛出了错误，就会被 catch 捕获，如果没有 throw 出错误，就被继续执行后面的 then 。

31.代码输出结果

setTimeout(function () {
    console.log(1);
}, 100);

new Promise(function (resolve) {
    console.log(2);
    resolve();
    console.log(3);
}).then(function () {
    console.log(4);
    new Promise((resove, reject) => {
        console.log(5);
        setTimeout(() => {
            console.log(6);
        }, 10);
    })
});
console.log(7);
console.log(8);

输出结果如下：

2
3
7
8
4
5
6
1

代码执行顺序如下：

1. 首先遇到定时器，将其加入到宏任务队列；
2. 遇到 Promise ，首先执行里面的同步代码，打印出2，遇到 resolve ，将其加入到微任务队列，执行后面同步代码，打印出 3；
3. 继续执行 script 中的代码，打印出 7 和 8 ，至此第一轮代码执行完成；
4. 执行微任务队列中的代码，首先打印出 4，如遇到 Promise ，执行其中的同步代码，打印出 5，遇到定时器，将其加入到宏任务队列中，此时宏任务队列中有两个定时器；
5. 执行宏任务队列中的代码，这里我们需要注意是的第一个定时器的时间为 100ms ，第二个定时器的时间为 10ms ，所以先执行第二个定时器，打印出 6 ；
6. 此时微任务队列为空，继续执行宏任务队列，打印出 1 。