前端 JavaScript 进阶面试题, 原理
前端 JavaScript 进阶面试题, 原理
QA
Step 1
Q:: 什么是闭包（Closure）？请解释其原理，并举例说明。
A:: 闭包是指有权访问另一个函数作用域中变量的函数。闭包的创建依赖于函数嵌套，内部函数可以访问外部函数的变量，即使外部函数已经执行结束。闭包的例子：
function outer() {
let count = 0;
return function inner() {
count++;
console.log(count);
};
}
const counter = outer();
counter(); // 1
counter(); // 2
在上述例子中，inner 函数形成闭包，可以访问 outer 函数的变量 count。
Step 2
Q:: 解释 JavaScript 中的事件循环机制。
A:: 事件循环（Event Loop）是 JavaScript 处理异步编程的基础。它包括一个循环过程，用来监视调用栈和消息队列，当调用栈为空时，会从消息队列中取出第一个事件并将其压入调用栈执行。事件循环使得 JavaScript 能够执行非阻塞的 I/O 操作。以下是简单的事件循环示例：
console.log('Start');
setTimeout(() => {
console.log('Timeout');
}, 0);
console.log('End');
在这个例子中，输出顺序是 Start, End, Timeout，因为 setTimeout 的回调函数被推入消息队列，需等到主线程执行完同步代码后再执行。
Step 3
Q:: JavaScript 中的 this 关键字是如何工作的？
A:: this 关键字在 JavaScript 中根据函数调用的方式而不同。它通常指向调用函数的对象。以下是 this 关键字在不同上下文中的表现：
1. 全局上下文：在浏览器中，this 指向 window 对象。
2. 对象方法：this 指向调用方法的对象。
3. 构造函数：this 指向新创建的实例对象。
4. 显式绑定：通过 call, apply, bind 方法可以显式指定 this 指向。
示例：
function showThis() {
console.log(this);
}
const obj = {
show: showThis
};
showThis(); // window or global object
obj.show(); // obj
Step 4
Q:: 解释 JavaScript 中的原型链。
A:: 原型链是 JavaScript 中实现继承的一种机制。每个对象都有一个内部链接指向另一个对象，称为其原型。原型对象也有自己的原型，如此层层链接，形成一个原型链。当访问一个对象的属性时，JavaScript 会首先在对象自身的属性中查找，如果找不到，则沿着原型链向上查找。示例：
function Person(name) {
this.name = name;
}
Person.prototype.sayHello = function() {
console.log('Hello, ' + this.name);
};
const alice = new Person('Alice');
alice.sayHello(); // Hello, Alice
console.log(alice.__proto__ === Person.prototype); // true
console.log(Person.prototype.__proto__ === Object.prototype); // true
Step 5
Q:: 解释 JavaScript 中的 Promise 及其使用场景。
A:: Promise 是一种用于处理异步操作的对象。它代表一个异步操作的最终完成（或失败）及其结果值。Promise 有三种状态：pending（进行中）、fulfilled（已成功）和 rejected（已失败）。使用 Promise 可以避免回调地狱，使代码更具可读性和可维护性。
示例：
const promise = new Promise((resolve, reject) => {
setTimeout(() => {
resolve('Success');
}, 1000);
});
promise.then(value => {
console.log(value); // Success
}).catch(error => {
console.log(error);
});
Promise 的使用场景包括网络请求、定时器操作等需要等待结果的异步操作。