专栏首页OECOM详解cmd规范

详解cmd规范

cmd的全称是Common Module Definition,即通用模块定义,其提供了模块定义和按需加载执行模块。该规范明确了模块的基本书写格式和基本的交互规则。

在CMD规范中,一个文件就是一个模块,使用define来进行模块:

define(factory)

这里的define是一个全局函数,用来定义模块,这里的factory参数既可以是函数,又可以是字符串或对象。如果参数是字符串或对象时,表示该模块的接口就是是该对象或字符串:

define({'website':'oecom'});
define('这里是OECOM');

当factory为函数时,此函数就是模块的构造方法,该函数默认为提供三个参数:require,exports,module

define(function(require,exports,module){

})

require

同步加载

require参数也是一个方法,接收的参数为模块标识,其实就是需要加载模块的相对路径,作用就是加载其他模块。

define(function(require,exports,module){
    var a = require('./a');
    a.out();//假设模块a有out方法。
})

异步加载

直接使用require加载属于是同步加载,require提供了async方法来在模块内部进行也不加载模块,并在加载完成以后执行指定的回调函数。

define(function(require,exports,module){
    require.async('./a',function(a){
        a.doSomething()
        })
        require.async(['./c','./b'],function(c,b){
        c.doSomething()
        b.doSomething()
        })
    })

注意require 是同步往下执行,require.async 则是异步回调执行。require.async 一般用来加载可延迟异步加载的模块。

获取模块路径

require.resolve使用模块系统内部的路径解析机制来解析并返回模块路径。该函数不会加载模块,只返回解析后的绝对路径。

define(function(require,exports){
    console.log(require.resolve('./a'));
    //http://example.com/path/to/a.js
    })

该方法一般用于插件环境或需要动态拼接模块路径的场景。

exports

exports是一个用来想外接提供模块接口的对象

define(function(require,exports){
    var name = 10;
    exports.name = name;
    exports.out = function(){
        console.log("输出内容")
    }
    })

当加载的时候就可以直接使用下面的方式了:

define(function(require,exports,module){
    var a = require('./a');
    a.out();//输出内容
    console.log(a.name);//10
})

当然导出模块还可以直接使用return的方式

define(function(require){
    return{
        name:10,
        out:function(){
            console.log("输出内容")
        }
    }
})

但是千万不要写成

 exports = {
        name:10,
        out:function(){
            console.log("输出内容")
        }
  };

但是可以用module.exports的形式来写:

define(function(require,exports,module){
    module.exports = {
        name:10,
        out:function(){
            console.log("输出内容")
        }
    }
})

提示exports 仅仅是 module.exports 的一个引用。在 factory 内部给 exports重新赋值时,并不会改变 module.exports 的值。因此给 exports 赋值是无效的,不能用来更改模块接口。

还有一点就是导出模块不要写在回调函数里,导出是需要同步执行,否则导入是会导入失败。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 详解AMD规范

    AMD全称是Asynchronous Modules Definition异步模块定义,提供定义模块及异步加载该模块依赖的机制,这和浏览器的异步加载模块的环境刚...

    无邪Z
  • 微信开发给网页页面添加背景音乐

    在微信开发中,单纯的页面展示并不能够吸引客户的眼球,需要有视觉和听觉的双重效果,才能够吸引住客户浏览,达到产品宣传的目的,前面说过很多页面的特效,今天我来说一种...

    无邪Z
  • 微信小程序自定义轮播面板样式

    在进行pc网站或移动端网站开发时,轮播经常会遇到,我们经常使用的就是swiper插件来实现轮播效果,如果想自定义其样式的话,完全可以重写其css,达到自定义的效...

    无邪Z
  • 前端模块化理解

    在JavaScript发展初期就是为了实现简单的页面交互逻辑,寥寥数语即可;如今CPU、浏览器性能得到了极大的提升,很多页面逻辑迁移到了客户端(表单验证等),随...

    用户7413032
  • 如何判断架构设计的优雅和优劣

    KISS 全称是 Keep it Simple, Stupid,用最直白的话说,“简单就是美”。不增加无谓的复杂性。正确理解系统的需求之后才进行设计。要避免过...

    春哥大魔王
  • CommonJS 和 ES6 Module 究竟有什么区别?

    作为前端开发者,你是否也曾有过疑惑,为什么可以代码中可以直接使用 require 方法加载模块,为什么加载第三方包的时候 Node 会知道选择哪个文件作为入口,...

    coder_koala
  • JavaScript模块化-CommonJS、AMD、CMD、UMD、ES6

    AMD(Asynchronous Module Definition)异步模块定义,客户端规范。采用异步方式加载模块,模块加载不影响它后面语句的代执行。

    胡哥有话说
  • Python-模块与包的管理

    - 大大提高了代码的可维护性; - 编写代码不必从零开始。当一个模块编写完毕,就可以被其他地方引用;

    py3study
  • 深度学习的起源与先行者

    在二十世纪五十年代就存在深度学习的概念了。麦肯锡全球研究院发文简要回顾了深度学习是如何从概念发展为现实的,而使之实现的关键人物又是谁。

    人工智能快报
  • seajs简记

    超然

扫码关注云+社区

领取腾讯云代金券