常见的JS面试题

在JavaScript（JS）面试中，经常会遇到一系列基础知识和高级概念的考察。以下是一些常见的JS面试题及其代码演示，涵盖了变量声明、类型比较、数组操作、闭包、事件处理等多个方面

1. 变量声明：var、let、const的区别

问题：请解释var、let和const的区别。

回答：

• var声明的变量具有函数作用域或全局作用域，存在变量提升现象。
• let和const声明的变量具有块作用域，没有变量提升，且const声明的变量一旦被赋值后不可再被重新赋值。

代码演示：

if (true) {
   
    var varVar = 'var';
    let letVar = 'let';
    const constVar = 'const';

    console.log(varVar); // var
    console.log(letVar); // let
    console.log(constVar); // const

    // 尝试修改const声明的变量
    // constVar = 'newConst'; // Uncaught TypeError: Assignment to constant variable.
}

console.log(varVar); // var，因为var具有函数作用域
// console.log(letVar); // ReferenceError: letVar is not defined，因为let具有块作用域
// console.log(constVar); // 同上

2. 类型比较：== 和 === 的区别

问题：请解释==和===的区别。

回答：

• ==（相等操作符）会进行类型转换后再比较。
• ===（严格相等操作符）不会进行类型转换，直接比较类型和值。

代码演示：

console.log(0 == '0'); // true，因为'0'会被转换成数字0
console.log(0 === '0'); // false，因为类型和值都不相同

console.log(null == undefined); // true，null和undefined在==下相等
console.log(null === undefined); // false，null和undefined在===下不相等

3. 数组去重

问题：如何去除数组中的重复元素？

回答：
可以使用Set对象或者filter方法结合indexOf。

代码演示（使用Set）：

const arr = [1, 2, 2, 3, 4, 4, 5];
const uniqueArr = [...new Set(arr)];
console.log(uniqueArr); // [1, 2, 3, 4, 5]

4. 闭包

问题：什么是闭包？并给出一个简单的例子。

回答：
闭包是一个函数值，它引用了其外部作用域的一个或多个变量。

代码演示：

function outer() {
   
    let x = 'outer';
    function inner() {
   
        return x;
    }
    return inner;
}

const myClosure = outer();
console.log(myClosure()); // outer，即使outer执行完毕，x依然被inner引用

5. 事件冒泡与事件捕获

问题：解释事件冒泡和事件捕获，并说明如何设置。

回答：

• 事件冒泡：事件从目标元素开始，然后逐级向上传播到DOM树的最顶层。
• 事件捕获：与事件冒泡相反，事件从DOM树的最顶层开始，然后逐级向下传播到目标元素。

代码演示（设置事件捕获）：

document.getElementById('myElement').addEventListener('click', function() {
   
    console.log('Clicked!');
}, true); // 第三个参数为true，表示使用事件捕获

这些面试题和代码演示覆盖了JavaScript面试中的基础知识和常见考点，希望对你有所帮助。