JavaScript全局变量在函数中不能用的秘密

在JavaScript编程中，全局变量是一个常见但容易引起误解的概念。今天我们来探讨一下为什么全局变量在function中不能用，以及如何正确使用它们。

首先，我们需要明确什么是全局变量。在JavaScript中，全局变量是指在函数外部定义的变量，它们可以在整个脚本中访问和修改。通常，全局变量通过var、let或const关键字声明在脚本的最顶层。

var globalVar = "I am a global variable";

当我们试图在函数内部直接使用全局变量时，可能会遇到一些问题：

变量提升（Hoisting）：JavaScript有一个特性叫做变量提升，这意味着变量声明会被提升到函数或全局作用域的顶部。如果在函数内部声明了一个与全局变量同名的变量，那么这个局部变量会覆盖全局变量。
```
 var globalVar = "Global";

 function test() {
     console.log(globalVar); // 输出: undefined
     var globalVar = "Local";
     console.log(globalVar); // 输出: Local
 }
 test();
```
在这个例子中，globalVar在函数内部被重新声明并赋值为"Local"，因此在第一次console.log时，globalVar实际上是undefined。
作用域链（Scope Chain）：JavaScript的作用域链决定了变量的查找顺序。函数内部首先查找局部变量，如果没有找到，再向上查找全局变量。如果函数内部定义了同名的局部变量，全局变量将被屏蔽。
```
 var globalVar = "Global";

 function test() {
     var globalVar = "Local";
     console.log(globalVar); // 输出: Local
 }
 test();
```
这里，globalVar在函数内部被声明为局部变量，因此全局变量被屏蔽了。

为了避免上述问题，我们可以采取以下几种方法：

使用this关键字：在全局作用域中，this指向全局对象（在浏览器中是window），因此可以通过this.globalVar来访问全局变量。
```
 var globalVar = "Global";

 function test() {
     console.log(this.globalVar); // 输出: Global
 }
 test();
```

使用全局对象：直接通过全局对象（如window）来访问全局变量。

 var globalVar = "Global";

 function test() {
     console.log(window.globalVar); // 输出: Global
 }
 test();

避免全局变量：尽量减少全局变量的使用，采用模块化编程或使用闭包来封装变量。

 (function() {
     var localVar = "I am local";
     function innerFunction() {
         console.log(localVar);
     }
     innerFunction();
 })();

全局变量在function中不能用主要是因为JavaScript的作用域机制和变量提升特性。通过理解这些机制，我们可以更好地管理全局变量，避免意外的变量覆盖和作用域问题。希望这篇文章能帮助大家更深入地理解JavaScript中的全局变量使用，并在实际编程中避免常见的坑。