Question

我很想知道当你按如下方式创建一个类时，这个类是否成为每个文件导入的新实例。

class _Http {

}

let Http = new _Http();
export default Http;

每次我需要或导入文件时，是否会更新此类。例如：

如果我将文件导入view / splash.js然后导入view / groups.js，如下所示：

从＆＃39; ../../ utils / http＆＃39;;

导入http

这是同一个例子吗？我已经读过这是一个单例模式，但看起来导入会新增实例。

Answer 1

每次我需要或导入文件时，这个类都会被新建。

没有。您导出的是变量 Http。您对该变量的初始化只发生一次（给定您的代码）。

如果我将文件导入view/splash.js，然后导入view/groups.js，如下所示：
import http from '../../utils/http';
这是同一个实例吗？

是。它是相同的变量（技术上，活动绑定到变量），它只能包含一个东西（在这种情况下，是对你创建的实例的引用）。

实际上，如果定义它的模块中的代码在某个时刻更改了值，那么在使用它的所有模块中都可以看到该更改。您真正将实时链接导出到变量，而不是其值的副本。（这些语义可能无法通过采用ES2015模块语法并将其转换为其他内容的东西完美保留，但这是如何定义的。）

例如，如果你有这个：

export let a = 0;
setInterval(() => { // For demonstration purposes only
    ++a;
}, 500);

然后像这样使用它：

import { a as theVar } from './mod.js';
const display = document.getElementById("display");
setInterval(() => {
    display.innerHTML = String(theVar);
}, 50);

在此页面中：

<body>
  <p id="display"></p>
  <script type="module" src="script.js"></script>
</body>

在类似当前Chrome的浏览器上，该浏览器本身支持ES2015 +模块，您可以看到script.js在其{{1}中看到mode.js对a所做的更改}} 捆绑。 Live example （同样，需要一个支持模块的尖端浏览器）。

节点JS类实例化预期的行为

1 个答案: