跨文件的 JavaScript 全局变量 - JavaScript

在 JavaScript 中，全局变量指的是在任何地方都可以访问的变量。默认情况下，在不同的 JavaScript 文件中定义的全局变量是相互隔离的，也就是说，一个文件中定义的全局变量无法在另一个文件中直接访问。

然而，有时我们希望在多个文件中共享某个变量，这就需要使用一种跨文件的全局变量的机制。下面介绍几种常见的方法来实现这一目标。

1. 使用全局对象（window 或 global）

在浏览器环境中，我们可以使用 window 对象来创建全局变量。在 Node.js 环境中，可以使用 global 对象来实现相同的功能。

// file1.js
window.sharedVariable = 42;

// file2.js
console.log(window.sharedVariable); // 输出: 42

此方法的缺点是需要显式地将变量存储在全局对象中，打破了模块化的原则。

2. 使用模块系统

在使用模块系统（如 CommonJS、ES6 Modules）的环境中，可以使用导入和导出机制来共享变量。

// file1.js
export const sharedVariable = 42;

// file2.js
import { sharedVariable } from './file1.js';
console.log(sharedVariable); // 输出: 42

该方法的优点是更加符合模块化原则，但需要使用模块系统。

3. 使用全局命名空间

全局命名空间是一种将变量组织在一个全局对象中的方式，以避免全局变量的冲突。

// file1.js
window.myApp = window.myApp || {};
window.myApp.sharedVariable = 42;

// file2.js
console.log(window.myApp.sharedVariable); // 输出: 42

通过将全局变量存储在一个命名空间下，我们可以避免变量冲突的问题，并显式地访问全局变量。

4. 使用单例模式

使用单例模式可以创建一个仅有一个实例的对象，这个对象可以在多个文件中共享。

// file1.js
const sharedVariable = {
  value: 42,
};

export default sharedVariable;

// file2.js
import sharedVariable from './file1.js';
console.log(sharedVariable.value); // 输出: 42

通过创建一个单例对象，我们可以在多个文件中共享该对象的状态和方法。

以上是几种常见的实现跨文件的 JavaScript 全局变量的方法。根据具体的需求和环境选择适合的方法来实现全局变量的共享。记住，在使用全局变量时，要注意避免变量冲突和滥用全局变量带来的不良影响。