面试题：JavaScript中作用域与块级作用域的区别

Question

请详细阐述JavaScript普通作用域和块级作用域在变量声明、访问范围等方面有哪些不同，并举例说明。

Answer 1

变量声明

• 普通作用域：在JavaScript中，普通作用域指函数作用域。使用var声明变量时存在变量提升现象，即变量声明会被提升到函数作用域的顶部，但变量赋值留在原地。例如：

function test() {
    console.log(a); // 输出undefined，变量提升，a声明被提升到函数顶部，但未赋值
    var a = 1;
}
test();

• 块级作用域：ES6引入let和const用于创建块级作用域。在块级作用域内，使用let或const声明的变量不会变量提升，在声明之前访问会报错，即存在暂时性死区（TDZ）。例如：

{
    console.log(b); // 报错，b在暂时性死区内，不能在声明前访问
    let b = 2;
}

访问范围

• 普通作用域：函数作用域内声明的变量在整个函数内都可访问，包括函数内嵌套的子作用域。例如：

function outer() {
    var x = 10;
    function inner() {
        console.log(x); // 输出10，能访问到outer函数作用域中的x
    }
    inner();
}
outer();

• 块级作用域：块级作用域由{}界定，使用let或const声明的变量仅在该块级作用域内有效。例如：

{
    let y = 20;
    console.log(y); // 输出20
}
console.log(y); // 报错，y超出块级作用域，无法访问