解释下隐式全局变量和外部函数作用域

在前端开发中，理解隐式全局变量和外部函数作用域对于避免 bug 和编写可维护的代码至关重要。它们都与变量的作用域以及如何访问这些变量有关。

1. 隐式全局变量 (Implicit Globals)

在 JavaScript 中，如果你声明一个变量而没有使用 var、let 或 const 关键字，它会自动成为全局变量。这就是所谓的“隐式全局变量”。

function myFunction() {
  myVar = "Hello"; // 没有使用 var, let 或 const
}

myFunction();
console.log(myVar); // 输出 "Hello" - myVar 变成了全局变量

问题:

命名冲突: 容易意外覆盖其他全局变量，导致难以调试的错误。
代码可读性差: 难以追踪变量的来源和作用域。
难以维护: 修改隐式全局变量可能会影响到代码的其他部分，造成意想不到的后果。

最佳实践: 永远使用 var、let 或 const 声明变量，避免创建隐式全局变量。let 和 const 是更现代的声明方式，它们具有块级作用域，更易于管理和理解，推荐优先使用。

2. 外部函数作用域 (Outer Function Scope)

当一个函数嵌套在另一个函数内部时，内部函数可以访问外部函数的变量。这就是所谓的“外部函数作用域”或“词法作用域”。

function outerFunction() {
  let outerVar = "Outer";

  function innerFunction() {
    console.log(outerVar); // 访问外部函数的 outerVar
  }

  innerFunction(); // 输出 "Outer"
}

outerFunction();

优点:

封装: 外部函数的变量可以被内部函数访问，但外部作用域无法直接访问内部函数的变量，实现了某种程度的封装。
闭包: 即使外部函数已经执行完毕，内部函数仍然可以访问外部函数的变量。这形成了闭包，是 JavaScript 中一个强大的特性，可以用于创建私有变量和状态管理。

示例 - 闭包:

function counter() {
  let count = 0;

  return function() {
    count++;
    console.log(count);
  };
}

let increment = counter();
increment(); // 输出 1
increment(); // 输出 2