为什么全局 let 声明会被无作用域的变量覆盖？答案

【问题标题】：Why global let declarations get overridden by unscoped variables?为什么全局 let 声明会被无作用域的变量覆盖？
【发布时间】：2019-08-01 08:31:05
【问题描述】：

当我们在没有指定let 或var 的情况下创建变量时，它会被添加到浏览器中的窗口对象中。例如

function change(){
    val = 20;
}
change();
console.log(window.val); //20
console.log(val);  //20

在这里我得到两个控制台日志打印值20。但是我使用let 做同样的事情，它不会被添加到窗口对象中。我看到this answer 解释了为什么会发生这种情况。

let val = 20;
console.log(window.val); //undefined
console.log(val); //20

现在，在下面的代码中，有人可以解释一下，当我在函数内部分配一个非作用域变量时，为什么它没有被添加到window 作用域？而是如何更改使用let 声明的变量的值

let value = 10;
function change(){
    value = 20;
}
change();
console.log(window.value); //undefined 
console.log(value); //20  why this is 20?

【问题讨论】：

【解决方案1】：

MDN 这么说 var:

使用var 声明的变量的范围是它当前的执行上下文，它可以是封闭函数，或者对于在任何函数之外声明的变量，是全局的。如果你重新声明一个 JavaScript 变量，它不会丢失它的值。

MDN 这么说 let:

let 声明的变量在定义它们的块以及任何包含的子块中都有其范围。这样，let 的工作方式与var 非常相似。主要区别在于var 变量的作用域是整个封闭函数：

它们最终都在一个作用域中，然后传播到子作用域，但是它们最终在哪个作用域中以及它们如何确定该作用域是不同的。

请注意，整个<script> 元素确实有一个隐式块，并且这个隐式块继承window 作为祖先范围。 var 声明的变量最终作用于window，而let 声明的变量作用于这个隐式块。

【讨论】：

【解决方案2】：

在脚本的顶层使用 let 声明变量可以让您在整个脚本内部甚至外部访问它。在您的函数内部，您没有为无作用域的变量赋值。

即使您要编写如下函数，它也不会分配给窗口对象，因为它将是函数作用域。

function change(){
var value = 20;
}

【讨论】：