RequireJS

Posted 2020-06-29 Allen_yang

学习requirejs过程中....

RequireJS的目标是鼓励代码的模块化，它使用了不同于传统<script>标签的脚本加载步骤。可以用它来加速、优化代码，但其主要目的还是为了代码的模块化。它鼓励在使用脚本时以module ID替代URL地址。RequireJS的模块是模块模式的一个扩展，其好处是无需全局地引用其他模块。RequireJS的模块语法允许它尽快地加载多个模块，虽然加载的顺序不定，但依赖的顺序最终是正确的。同时因为无需创建全局变量，甚至可以做到在同一个页面上同时加载同一模块的不同版本。

如果模块存在依赖：则第一个参数是依赖的名称数组；第二个参数是函数，在模块的所有依赖加载完毕后，该函数会被调用来定义该模块，因此该模块应该返回一个定义了本模块的object。依赖关系会以参数的形式注入到该函数上，参数列表与依赖名称列表一一对应。如下所示：

define(["./cart", "./inventory"], function(cart, inventory) {
        return {
            color: "blue",
            size: "large",
            addToCart: function() {
                inventory.decrement(this);
                cart.add(this);
            }
        }
    }
);

模块函数以参数"cart"及"inventory"使用这两个以"./cart"及"./inventory"名称指定的模块。在这两个模块加载完毕之前，模块函数不会被调用。

存在依赖的函数定义

如果模块存在依赖：则第一个参数是名称数组；第二个则是函数。在模块的所有依赖加载完毕后，该函数会被调用来定义该模块。参数列表与依赖名称一一对应。

define(["./cart", "./inventory"], function(cart, inventory) {
        return {
            color: "blue",
            size: "large",
            addToCart: function() {
                inventory.decrement(this);
                cart.add(this);
            }
        }
    }
);

循环依赖

如果我们定义了一个循环依赖(a依赖b，b同时依赖a)，则在这种情形下当b的模块函数被调用的时候，它会得到一个undefined的a。b可以在模块已经定义好后用require()方法再获取(记得将require作为依赖注入进来)，示例如下

```define(["require", "a"],
    function(require, a) {
        return function(title) {
            return require("a").doSomething();
        }
    }
);
```

官网使用说明：http://www.requirejs.cn/