CMD规范

左手的ㄟ右手 2022-05-17 00:08 153阅读 0赞

对于浏览器端，为了实现JavaScript模块化开发，提出了AMD和CMD规范。  
本文介绍一下CMD规范包含的内容，主要介绍内容包含书规则和引用方式。

### define—–定义 ###

--------------------

顾名思义，*define*是用来定义模块的，它是一个全局函数，可以接受不同形式的参数。  
形式:

define(name?,depend?,constructor) //例子 define('helloWorld',['react','vue'],function(require,exports,module){ //模块代码 });

上述包含三个参数

*    
    
 *  name: 是一个字符串，表示模块标识;
 *  depend: 是一个数组，表示模块的依赖文件列表;
 *  constructor: 当此参数是字符串，对象时，返回的接口就是本身。当为函数时，成这个函数为模块的构造函数，执行此函数，得到向外提供的接口。此函数默认接受三个参数：*require*、*exports*、*module*，下文会详细介绍这三个参数分别是什么。  
    注意：

> 上面的形式其实并不能说是 *CMD*规范要求的， *CMD*规范不带前两个参数。

##### define.cmd #####

一个空对象，可判断当前页面是否有CMD模块加载器

if (typeof define === "function" && define.cmd) {
      // 有满足CMD规范的模块加载器存在
    }

### require—–加载 ###

--------------------

*require*是一个方法，根据模块标识，获取其他模块提供的接口。  
使用方法：

require(name)；
    //demo
    define(function(require){ 
        var a = require("a");
        a.sayHello();
    })

##### require.async—–异步加载 #####

此方法用于在模块内部异步加载模块，加载完执行相应回调函数。  
如下：

//格式
    require(name,callback?);
    //demo
    define(function(){ 
        //异步加载一个模块
        require.async("a",function(a){ 
            a.sayHello();
        });
        //异步加载多个模块
        require.async(['a','b'],function(a,b){ 
            a.sayHello();
            b.sayHello();
        });
    })

注意：

> require是同步向下执行，require.async是异步回调执行。require.async一般用来加载可延迟加载的模块。

##### require.resolve—–异步加载 #####

此方法返回模块的绝对路径，但是并不会加载模块。

### module—–模块 ###

此对象用于存储模块相关信息。

##### module.id—–标识符 #####

使用*define*定义模块的时候，可以传入一个唯一标识此模块的标识符。通过module.id属性可以获取模块的标识符。

##### module.uri—–路径 #####

获取模块绝对路径。

##### module.dependencies—–依赖 #####

一个数组，获取模块的依赖。