javascript - 非法遮蔽(用 var 遮蔽 let)

标签 javascript shadowing

考虑以下 JavaScript 中的阴影示例:

let a = 99;                                                                                                             
{
        var a = 10;
        let b = 11;
        const c = 200;
        console.log(a);
}
console.log(a);

这里我收到以下错误:

SyntaxError: Identifier 'a' has already been declared

但在下面的情况下,没有语法错误,代码完全有效。

var a = 99;                                                                                                             
{
    let a = 10;
    let b = 11;
    const c = 200;
    console.log(a);
}
console.log(a);

在第二种情况下,var a 在全局作用域中声明,而 let a 在 block 作用域中声明。 但为什么这在第一种情况下无效? 其中,let a 将在单独的作用域中声明,而 var a 应在全局作用域中声明。 为什么这个案例无效?

最佳答案

But why this is not valid in first case?

因为这两个声明都在同一作用域中。¹ 您的第二个示例之所以有效,是因为 let 的作用域仅限于该 block ,而不是该 block 之外的作用域其中 var a 存在。 (就像函数中的局部变量一样。)因此在第二个示例中,它是阴影。在第一个示例中,它不会是阴影,而是重复,这是 let 无法做到的(即使其他声明使用 var)。 (您可以使用var在同一作用域中多次声明一个变量。随后的var将被忽略,尽管该变量上的任何初始值设定项都会被忽略。变量被转换为赋值。例如,var a; var a = 42;var a; a = 42; 相同)


好吧,从技术上来说,它比这更复杂一些。 var 变量存在于“外部”全局词法环境中,该环境在全局对象上保存绑定(bind)(松散地,变量),但是 let 变量存在于“内部”全局词法环境中,该环境不保留其在全局对象上的绑定(bind)。全局作用域仍然只是一个作用域,因此正如您所看到的,您不能在全局作用域中同时使用 var alet a,因为它们相互冲突。但是还有其他方法可以创建“外部”全局变量,例如分配给 window 上的属性(或全局范围内的 this ,或 globalThis > 在现代环境中):

// At global scope
window.a = 42;    // Creates binding in the outer global environment
console.log(a);   // Shows 42

这意味着可以在外部和内部全局词法环境中创建绑定(bind):

// At global scope
window.a = 42;    // Creates binding in the outer global environment
let a = "answer"; // Creates binding in the inner global environment
console.log(a);   // Shows "answer"

由于内部的代码更接近执行 console.log(a) 的代码,因此上面的输出是 "answer"

有趣的事实:根据您的计算方式,在浏览器上,“全局”环境有两层到六层之间。😮

关于javascript - 非法遮蔽(用 var 遮蔽 let),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/67332627/

相关文章:

c++ - DirectX 11 - 点光阴影

javascript - 在 Canvas 上渲染 svg 图像

Javascript 用表达式和闭包进行封装

matlab - 解决与内置函数的名称冲突,另请参阅文档部分

java - Java 类中使用的变量阴影是什么?

python - 从(或接近)具有相同名称的脚本导入库会引发 "AttributeError: module has no attribute"或 ImportError 或 NameError

javascript - 如何检查 jQuery 插件和函数是否存在?

javascript - Neo4J Javascript 驱动程序无法将读取的数据传递给对象

javascript - 恢复 native 窗口方法

java - Java 中使用局部变量隐藏实例变量