1. 前端面试题之代码输出

代码输出结果也是面试中常考的题目，一段代码中可能涉及到很多的知识点，这就考察到了应聘者的基础能力。在前端面试中，常考的代码输出问题主要涉及到以下知识点：异步编程、事件循环、this指向、作用域、变量提升、闭包、原型、继承等，这些知识点往往不是单独出现的，而是在同一段代码中包含多个知识点。所以，笔者将这些问题大致分为四类进行讨论。这里不会系统的阐述基础知识，而是通过面试例题的形式，来讲述每个题目的知识点以及代码的执行过程。如果会了这些例题，在前端面试中多数代码输出问题就可以轻而易举的解决了。

异步＆事件循环

1.代码输出结果

const promise = new Promise((resolve, reject) => {
    console.log(1);
    console.log(2);
})

promise.then(() => {
    console.log(3);
})

console.log(4);

输出结果如下：

1
2
4

代码执行顺序如下：

1. 执行 new Promise 的时候，会立即执行 Promise 构造函数中的代码，打印数字 1 和 2 ;
2. 注册的回调函数会在 Promise 对象被解析时执行，但是当前的 Promise 对象没有被解析（没有调用 resolve 或 reject），所以回调函数不会立即执行；
3. 执行console.log，打印数字 4。

2.代码输出结果

const promise1 = new Promise((resolve, reject) => {
    console.log('promise1')
    resolve('resolve1')
})
const promise2 = promise1.then(res => {
    console.log(res)
})
console.log('1', promise1);
console.log('2', promise2);

输出结果如下：

promise1
1 Promise {<fulfilled>: 'resolve1'}
2 Promise {<pending>}
resolve1

代码执行顺序如下：