JavaScript 和 ES6,“全局”变量

IT技术 javascript reactjs
2021-05-19 00:18:55

3 年来,我一直在使用 JavaScript 的小片段,但现在我正在构建一个 React 应用程序并且我正在研究它。有一个基本的东西我不明白。React 使用 Dispatcher 和 Stores 来构建它的 Flux 模式,我不明白的是这个 Dispatcher 在所有应用程序中都是可见的,因为 Actions 使用 Dispatcher 来调度 Actions,Stores 注册到 Dispatcher 以获得通知(所以它不是每次都是新的调度员)。那么,我怎样才能实现这个“全局”范围或任何它所谓的范围?如何使用 ES6 类(module)实现这一点?

由于我缺乏真正的 JavaScript 编程经验,这个问题可能不清楚,我希望通过社区评论我能够安排。

2个回答

无论您身在何处,您始终可以将变量分配给window.MyClass = whateverglobal.MyClass对于 nodejs),并从应用程序中的任何其他文件访问这些值。但这并不总是在您的应用程序中全局共享数据的最佳方式。nodejs 中的module加载器(或 ES6 中的 AMD)接受你导出的任何内容并缓存它。假设您有一个文件,例如:

我的module.js:

class MyClass {
  constructor() {
    this.someData = 55;
  }
}

export default (new MyClass);

现在每当我们从其他地方需要这个文件时,我们总是得到相同的MyClass. 这意味着:

文件1.js:

import MyClass from './MyModule'
MyClass.someData = 100;

file2.js:

import MyClass from './MyModule'
console.log(MyClass.someData);

这称为单例模式,我们在整个应用程序中传递类的一个公共实例。因此,通过这种方式,我们能够访问MyClass来自不同文件的同一个实例,而不会污染全局范围(我们避免分配global.MyClass但完成相同的功能)。

您正在寻找的是创建一个单身人士。来自http://amanvirk.me/singleton-classes-in-es6/

let instance = null;
export default class Cache{
  constructor() {
    if (!instance) { instance = this; }
    this.time = new Date()

    return instance;
  }
}

我测试了这个并且它有效。您只需将 this.time = new Date() 替换为 this.singletonFunction = function(){}。你想在哪里使用它然后做你的导入

let aSingleton = (new importName()).singletonFunction;