Question

当我们创建变量而不指定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?

Answer 1

MDN关于var这样说：

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

MDN关于let这样说：

由let声明的变量的范围在定义它们的块中以及在任何包含的子块中。这样，let的工作原理就非常类似于var。主要区别在于var变量的范围是整个封闭函数：

它们最终都在一个范围内，然后传播到子范围，但是它们最终位于哪个范围内以及如何确定该范围是不同的。

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

Answer 2

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

即使您要按以下方式编写函数，也不会将其分配给window对象，因为它将受到函数作用域的限制。

function change(){
var value = 20;
}

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

2 个答案: