什么是 JavaScript 中的变量作用域？

在本文中，我们将了解 JavaScript 的范围。范围管理变量的可用性，或者我们也可以说它决定了变量的可访问性。

JavaScript 中的作用域类型：

• 块范围
• 函数范围
• 本地范围
• 全球范围

块作用域：早期的 JavaScript 只有全局作用域和函数作用域。让和 常量 是 ES6 引入的两个新的重要关键字，这两个关键字在 JavaScript 中提供了块作用域。 ECMAScript (ES6) 2015 是 JavaScript 的第二次重大修订。 { } 块内声明的变量不能从块外访问。

• 让关键字：

  示例：此处不能使用 x

  {
   let x = 2;
  }

• var关键字：

  示例：此处可以使用 x

  {
   var x = 2;
  }

用var关键字声明的变量不能有块作用域，它们可以在 { } 块内声明，并且可以从块外访问。

例子：

HTML

  

    GeeksforGeeks
    
        function foo() {
            if (true) {
                var x = '1';    // Exist in function scope
                const y = '2';  // Exist in block scope
                let z = '3';    // Exist in block scope
            }
            console.log(x);
            console.log(y);
            console.log(z);
        }
        foo();
    

  

输出（在控制台中）：

1
y is not defined

函数作用域： JavaScript 有一个函数作用域，每个函数都创建一个新作用域。函数内部定义的变量不能从函数外部访问，使用var 、 let和const声明的变量在函数内部声明时非常相似。

• var关键字：

  例子：

  function myFunction() {
     var firstName = "Krishna";   // Function Scope
  }

• 让关键字：

  例子：

  function myFunction() {
    let firstName = "Krishna";   // Function Scope
  }

• 常量关键字：

  例子：

  function myFunction() {
     let firstName = "Krishna";   // Function Scope
  }

局部作用域：在函数内部声明的变量成为函数的局部函数。局部变量在函数启动时创建，在函数执行时删除。局部变量具有函数作用域，这意味着它们只能从函数内部访问。

例子：

// This part of code cannot use firstName

function myFunction() {
 let firstName = "Krishna";
 // This part of code can use firstName
}

This part of code cannot use firstName

HTML

  

    
        GeeksforGeeks
    
  
    
        function foo() {
            var x = '1';
            console.log('inside function: ', x);
        }
  
        foo();          // Inside function: 1
        console.log(x); // Error: x is not defined 
    

  

输出（在控制台中）：

inside function: 1
x is not defined

全局范围：全局声明的变量（在任何函数之外）具有全局范围，并且可以从程序中的任何位置访问全局变量。与使用var声明的函数范围变量类似，在块外声明时let和const非常相似。

• 让关键字：

  let x = 2;       // Global scope

• 常量关键字：

  const x = 2;     // Global scope

• var关键字：

  var x = 2;       // Global scope

例子：

HTML

  

    GeeksforGeeks
    
  
        // Global scope
        var x = '1'
        const y = '2'
        let z = '3'
  
        console.log(x);    // 1
        console.log(y);    // 2
        console.log(z);    // 3
  
        function getNo() {
            console.log(x);   // x is accessible here
            console.log(y);   // y is accessible here
            console.log(z);   // z is accessible here
        }
        getNo();           // 1
    

  

输出（在控制台中）：

1
 2
 3
 1
 2
 3