加载模块一次，requirejs 示例答案

【问题标题】：Loading module once, requirejs with examples加载模块一次，requirejs 示例
【发布时间】：2013-10-02 16:37:44
【问题描述】：

我已经问过类似的问题：Requirejs, what it means "Requirejs loads each module once"
但在那个主题中，没有人回答主要问题，因为我问错了。

所以我将提供一些简单的例子来说明我的意思：

模块 counter.js

1:    define([], function() {
2:        console.log("Executing counter");
3:        var counter = 0;
4:   
5:        return {
6:            increment: function() { counter++; },
7:            get: function() { return counter; }
8:        };
9:    });

模块 test1.js

1:    define(['counter'], function(counter) {
2:        console.log("Executing test1");
3:        counter.increment();
4:    });

模块 test2.js

1:    define(['counter'], function(counter) {
2:        console.log("Executing test2");
3:        counter.increment();
4:    });

Main.js

1:    require(['test1', 'test2', 'counter'], function(test1, test2, counter) {
2:        console.log("Executing main");
3:        alert(counter.get());
4:    });

所以模块 main.js 是应用程序的入口点，它将首先加载依赖项“test1”、“test2”和“counter”。（执行顺序：执行counter，执行test1，执行test2，执行main）

所以，如果我理解句子“Requirejs 加载每个模块一次”，这意味着（例如 counter.js）第 1 行到第 9 行的代码将被执行 ONLY ONCE 除了 test1、test2 和主模块在它们的依赖项列表中有计数器之外？如果这是正确的，test1 正在“负责”执行计数器模块？ 如果这是正确的，在执行计数器之后，内存中将是 ONLY ONE 对象，该对象将从计数器返回？当 test2 加载计数器时，它会得到那个 ONE 对象吗？（换句话说，test2 不会再次执行来自 counter 的代码，它们将使用现有的 counter 对象）？ 那么，我在这里创建 SINGLETON 吗？

最终所有模块都可以通过函数(increment, get) 闭包来影响计数器值（开始时，计数器 = 0）？ 当计数器对象存在于内存中时，闭包仍然存在？

【问题讨论】：

标签： javascript requirejs

【解决方案1】：

我将您的main.js 更改为登录控制台

require(['test1', 'test2', 'counter'], function(test1, test2, counter) {
        console.log("Executing main");
        console.log(counter.get());
});

另外我还有一个 index.html

<!DOCTYPE html>
<html>
<head>
    <title>My Counter Demo</title>
    <link rel="stylesheet" type="text/css" href="css/main.css">
    <script data-main="scripts/main" src="scripts/require.js"></script>
</head>
<body>
    <h1>My Counter Demo</h1>
</body>
</html>

加载index.html然后打开我拥有的网络控制台后

[22:04:09.077] "Executing counter"
[22:04:09.077] "Executing test1"
[22:04:09.077] "Executing test2"
[22:04:09.077] "Executing main"
[22:04:09.078] 2

记录消息

为了更清楚会发生什么，我建议替换日志消息

Executing counter -> Creating the counter AMD module
Executing test1 -> Incrementing the counter in module "test1"
Executing test2 -> Incrementing the counter in module "test2"
"Executing main" -> Retrieving the counter value in module "main"

我在控制台日志中得到以下结果

[22:16:46.368] file:///C:/Users/User/Documents/requirejs-counter2/css/main.css
[22:16:46.368] file:///C:/Users/User/Documents/requirejs-counter2/scripts/require.js
[22:16:46.369] file:///C:/Users/User/Documents/requirejs-counter2/scripts/main.js
[22:16:46.588] file:///C:/Users/User/Documents/requirejs-counter2/scripts/test1.js
[22:16:46.589] file:///C:/Users/User/Documents/requirejs-counter2/scripts/test2.js
[22:16:46.590] file:///C:/Users/User/Documents/requirejs-counter2/scripts/counter.js
[22:16:46.381] "Creating the counter AMD module"
[22:16:46.381] "Incrementing the counter in module "test1""
[22:16:46.381] "Incrementing the counter in module "test2""
[22:16:46.381] "Retrieving the counter value in module "main""
[22:16:46.381] 2

结论

计数器模块只加载一次，因此只创建一次计数器对象。你可以认为它是Singleton。

【讨论】：