这是 JavaScript 中变量阴影的一个例子吗？

Question

我在 Eloquent Javascript (Chapter 3) 中了解了术语变量阴影，但我正在尝试理解该概念的一个精确的基本示例。

这是阴影的例子吗？

var currencySymbol = "$";

function showMoney(amount) {
  var currencySymbol = "€";
  console.log(currencySymbol + amount);
}

showMoney("100");

Answer 1

这也就是所谓的可变范围。

一个变量只存在于其包含的函数/方法/类中，它们将覆盖任何属于更广泛范围的变量。

这就是为什么在您的示例中，将显示欧元符号，而不是美元。 （因为包含美元的currencySymbol 比包含欧元符号的currencySymbol 范围更广（全球）。

至于您的具体问题：是的，这是可变阴影的一个很好的例子。

Answer 2

在计算机编程中，当在某个范围（决策块、方法或内部类）中声明的变量与在外部范围中声明的变量具有相同的名称时，就会发生变量隐藏。据说这个外部变量被遮蔽了......

所以我相信你的例子很好。

您有一个与内部方法同名的全局命名变量。内部变量将仅在该函数中使用。没有该变量声明的其他函数将使用全局函数。

Answer 3

是的，你的例子是阴影的例子。

由于闭包在 JavaScript 中的工作方式，阴影也会在其他场景中持续存在。这是一个例子：

var x = -1;
function xCounter() {
    var x = 0;
    return function() {
        ++x;
        return x;
    };
}

console.log(x);   // -1
counter = xCounter();
console.log(counter());   // 1
console.log(counter());   // 2
console.log(x);   // still -1, global was never touched

请注意，在这种情况下，即使 xCounter 返回，它返回的函数仍然具有对其自己的 x 的引用，并且该内部函数的调用对全局没有影响，即使原始函数早已消失范围。

Answer 4

我们不能多次定义一个变量。但是我们可以在不同的范围内定义。

let name="tara"
if(true){
  let name="ali"
  if(true){
    console.log(name)
  }
}

变量遮蔽是指局部范围内的变量使用其值而不是父范围内的变量。因此，局部变量的值会遮蔽父级。

在上面的代码中定义了两个名称变量，但它们没有定义在同一个范围内。因此，console.log(name) 将检查本地范围，如果它找到它使用它的名称变量，如果没有，它会检查父范围一旦找到它，它会使用那个，所以它不会进入根。

Answer 5

var role = "Engineer";
console.log(role);

function displayRole(){
    role = "developer";
    console.log(role);
}

displayRole();
console.log(role);

注意最后一行代码 (console.log) 如何打印 developer 但它不在函数范围内。这是shadowing 的一个很好的例子，其中全局作用域中的角色变量已被函数作用域中的角色覆盖。

为避免遮蔽，函数作用域中的变量应使用 var 关键字声明，以便只能由函数访问。