JavaScript let 关键字

在JavaScript中， let是一个关键字 ，用于声明一个块级作用域变量。通常使用 var关键字 来声明一个在JavaScript中视为普通变量的变量，但使用let关键字声明的变量是块级作用域的。

JavaScript提供了三种声明变量的方式： var,const, 和 let 。 这些关键字提供了不同的功能。var是一种传统的声明变量的方法，而 const 和 let关键字 是ES2015/ES6之后引入的，用于创建 块级作用域变量 。

在JavaScript中，以前只有两种变量作用域： 全局作用域 和 函数作用域 。

let的语法

以下是使用 let关键字 声明一个变量的语法：

let variable_name;

示例

以下是各种示例，用于帮助您了解let变量在块或函数内外的工作原理。这些是使用let在不同作用域中声明变量的简单示例。

示例1：全局作用域

在这里，您可以看到在主体或函数外部声明的变量具有全局作用域。因此，它可以从函数内外的任何地方访问。

<script>
let x =20; 
document.write("Outside the function x = " + x); 

function show(){ 
    document.write("<br> Inside the function x = " + x); 
} 
show(); 
</script>

输出

Outside the function x = 20
Inside the function x = 20 

截图

这是上述程序的网页输出：

示例2：函数作用域

在这个示例中，你将看到一个在函数内部声明的变量只有函数作用域。因此，它不允许在函数外部访问。

<script>
function show(){ 
    let num = 15; 
    document.write("Inside the function num = " + num); 
} 
show(); 
document.write("<br> Outside the function num = " + num); 
</script>

输出

在这里，您会看到只有函数内的第一个语句被打印出来，第二个语句没有显示出来。它将 num is undefined 视为函数作用域之外的内容。

Inside the function num = 15

截图

这是上述程序的网页输出：

查看上述程序的控制台输出，以了解为什么第二个语句没有打印。在您的浏览器中，点击三个点并转到 **更多工具 – > 开发者工具 -> 控制台 ** ，并在控制台中查看以下错误：

UncaughtReferenceError: num is not defined

示例3：块级作用域

在这个示例中，你会发现在块内声明的变量不能在块外使用，因为它具有块级作用域。

<script>
  { 
    let num = 30; 
    document.write("Inside the function num = " + num); 
  } 
  document.write("<br> Outside the function num = " + num); 
</script>

输出

在这里，只有块语句会显示使用 let 关键字声明的 num 变量的值。第二个语句不会显示 num 变量的值。

Inside the function num = 30

屏幕截图

这是上述程序的网页输出：

查看上述程序的控制台输出，以了解为什么第二个语句没有打印出来。在您的浏览器中，点击三个点，进入 更多工具 – > 开发者工具 -> 控制台，然后在控制台中查看下面所示的错误：

UncaughtReferenceError: num is not defined

示例4：在不同的代码块中重新声明变量

在这个示例中，我们会在不同的代码块中声明一个具有相同名称的变量，并显示其值。

<script>
  let num = 23;
  { 
    let num = 15; 
    document.write("num inside the function = " + num); 
  } 
  let num = 89;
  document.write("<br> num outside the function = " + num); 
</script>

输出

在执行上述代码时，由于不允许使用let变量重新声明，因此会生成一个错误。因此，在浏览器上不会显示任何输出。

截图

这是上述程序的空白Web输出：

如果您看到控制台输出，这将显示执行此程序时生成的错误。

SyntaxError: redeclaration of let x
note: Previously declared at line 2, column 5  

let和var关键字有什么不同

在下面的示例中，你可以看到使用let关键字和var关键字声明的变量具有不同的变量作用域和能力。

let和var的主要区别在于它们的作用域。var具有全局作用域，而let具有块级作用域。请看以下示例来了解这个区别：

变量作用域

在这些示例中，我们将展示使用var和let声明的变量的作用域。

Var：全局作用域示例

<script>
function checkGlobalScope() {

  // x is declared yet so not available here
  document.write('Value of x before the block: ' + x);
  {
      var x = 20;
      x = x + 8;
  }
  // x is still known here and has a value.
  document.write('<br> Value of x after the block: ' + x);
}

//x is declared inside the function, so not available here 
checkGlobalScope()
</script>

输出

Value of x before the block: undefined
Value of x after the block: 28

截图

查看上面程序的Web截图：

let：块级作用域示例

<script>
function checkBlockScope() {
  {
    let x = 30;
    // initial value of x will print here
    document.write('Initial value of x: ' + x);

    x = x + 7;  
    // updated value of x will print
    document.write('<br> Value of x inside the block: ' + x);
  }
  // the value of x will not print here
  document.write('<br> Value of x outside the block: ' + x);
}

checkBlockScope()
</script>

输出

Initial value of x: 30
Value of x inside the block: 37

截屏

查看上述程序的网页截图：

这些示例将向您展示在使用var和let关键字声明变量时，变量在块内外部具有不同的作用域。

循环作用域

在这些示例中，我们将向您展示使用var和let声明的变量的作用域。

let：循环作用域示例

<script>
function checkLoopScope() {
 let i = 4;
 for (let i = 0; i < 10; i++) {
  // some statements
 }
  // x is still known here and has a value.
  document.write('Final value of x outside of the loop: ' + i);
}

checkLoopScope()
</script>

输出

在这里，您会看到i的初始值将显示，因为使用let关键字不允许重新声明。

Final value of x outside of the loop: 4

截图

查看上面程序的网页截图：

var：循环范围示例

<script>
function checkLoopScope() {
 var i = 4;
 for (var i = 0; i < 10; i++) {
  // some statements
 }
  // updated value of i will display
  document.write('Final value of x outside of the loop: ' + i);
}

checkLoopScope()
</script>

输出

这里，你会看到因为使用var关键字允许重新声明，所以会显示i的更新值。

Final value of x outside of the loop: 10

Screenshot

查看上述程序的网页截图:

重新声明

查看下面的示例以理解哪个变量声明是允许的，哪个是不允许的。使用var关键字可以在程序的任何位置进行变量声明。

示例1

var num = 6;
//num is 6 here

var num = 3;
//num is 3 here

示例2

var num = 6;
let num = 2;            //redeclaration is not allowed using let

示例3

let num = 6;             // allowed

let num = 2;            // not allowed

示例4

let num = 61;             // allowed
{
       let num = 29;            // allowed
}
{
       let num = 37;            // allowed
}