在JavaScript模块化开发中,为了让同一个模块可以运行在前后端,以及兼容多种模块规范(AMD,CMD,Node),类库开发者需要将类库代码包装在一个闭包内。

AMD规范

AMD,即“异步模块定义”。主要实现比如: RequireJS。

其模块引用方式如下:

js 代码:
define(id?,dependencies?,factory);

其中,id及依赖是可选的。其与CommonJS方式相似的地方在于factory的内容就是实际代码的内容,下面是一个简单的例子:

js 代码:
define(function(){
var exports = {};
exports.say = function(){
alert('hello');
};
return exports;
});

CMD规范

CMD规范,与AMD类似,区别主要在于定义模块和依赖引入的地方。主要实现比如: SeaJS。

主要区别是:AMD需要在声明模块时指定所有的依赖,通过形参传递依赖到模块内容中。

js 代码:
define(['dep1','dep2'],function(dep1,dep2){
return function(){};
});

与AMD相比,CMD更接近Node对CommonJS规范的定义:

js 代码:
define(factory);

在依赖部分,CMD支持动态引入,如下:

js 代码:
define(function(require,exports,module){
// Todo
});

require、exports、module通过形参传递给模块,在需要依赖模块时,随时调用require引入即可。

CommonJS的模块实现

CommonJS的模块引用使用require,如下:

js 代码:
var http = require('http');

Node的模块实现

在Node中引入模块,需要经过下面3个步骤:路径分析;文件定位;编译执行。主要用require()方法来查找模块。

兼容多种模块规范

为了让同一个模块可以运行在前后端,在开发过程中需要考虑兼容前后端问题,以下代码演示如何将hello()方法定义到不同的运行环境中,它能够兼容AMD、CMD、Node以及常见的浏览器环境中:

js 代码:
;(function (name, definition) {
// 检测上下文环境是否为AMD或CMD
var hasDefine = typeof define === 'function',
// 检查上下文环境是否为Node
hasExports = typeof module !== 'undefined' && module.exports; if (hasDefine) {
// AMD环境或CMD环境
define(definition);
} else if (hasExports) {
// 定义为普通Node模块
module.exports = definition();
} else {
// 将模块的执行结果挂在window变量中,在浏览器中this指向window对象
this[name] = definition();
}
})('hello', function () {
var hello = function () {};
return hello;
});

以上信息主要摘自书籍《深入浅出Nodejs》

兼容多种模块规范(AMD,CMD,Node)的代码的更多相关文章

  1. JavaSript模块规范 - AMD规范与CMD规范介绍(转)

    JavaSript模块规范 - AMD规范与CMD规范介绍 JavaSript模块化 在了解AMD,CMD规范前,还是需要先来简单地了解下什么是模块化,模块化开发? 模块化是指在解决某一个复杂问题或者 ...

  2. js模块系统 - amd|cmd|commonjs|esm|umd

    写过前端代码大概率听说过amd cmd umd commonjs esm这些名词, 想当初我第一次看到这些的时候, 人都麻了, 都是些啥啊. 后来我知道了, 这些都是js的模块规范. amd - 浏览 ...

  3. JavaSript模块规范 - AMD规范与CMD规范介绍

    JavaSript模块化   在了解AMD,CMD规范前,还是需要先来简单地了解下什么是模块化,模块化开发?       模块化是指在解决某一个复杂问题或者一系列的杂糅问题时,依照一种分类的思维把问题 ...

  4. JavaSript模块规范 - AMD规范与CMD规范介绍 (转载lovenyf.blog.chinaunix.net)

    JavaSript模块化   在了解AMD,CMD规范前,还是需要先来简单地了解下什么是模块化,模块化开发?       模块化是指在解决某一个复杂问题或者一系列的杂糅问题时,依照一种分类的思维把问题 ...

  5. 【转】JavaSript模块规范 - AMD规范与CMD规范介绍

    JavaSript模块化   在了解AMD,CMD规范前,还是需要先来简单地了解下什么是模块化,模块化开发?       模块化是指在解决某一个复杂问题或者一系列的杂糅问题时,依照一种分类的思维把问题 ...

  6. 浅析JS中的模块规范AMD和CMD

    一.AMD AMD就只有一个接口:define(id?,dependencies?,factory); 它要在声明模块的时候制定所有的依赖(dep),并且还要当做形参传到factory中,像这样: d ...

  7. JavaSript模块规范 - AMD规范与CMD规范介绍[转]

    原文地址:http://blog.chinaunix.net/uid-26672038-id-4112229.html JavaSript模块化 在了解AMD,CMD规范前,还是需要先来简单地了解下什 ...

  8. JavaSript模块规范 - AMD规范与CMD规范介绍 (转)

    JavaSript模块化   在了解AMD,CMD规范前,还是需要先来简单地了解下什么是模块化,模块化开发?       模块化是指在解决某一个复杂问题或者一系列的杂糅问题时,依照一种分类的思维把问题 ...

  9. JS模块之AMD, CMD, CommonJS、UMD和ES6模块

    CommonJS 传送门 同步加载,适合服务器开发,node实现了commonJS.module.exports和require 判断commonJS环境的方式是(参考jquery源码): if ( ...

随机推荐

  1. Taglist: Exuberant ctags (http://ctags.sf.net) not found in PATH. Plugin is not loaded

    1 开发环境 Ubuntu16.04(64bit) 2 错误描述 安装好Vim的TagList插件后,打开Vim提示: 3 解决方法 根据参考资料[1]的提示,可知那是因为当前系统没有安装ctags导 ...

  2. [Objective-C语言教程]快速枚举(35)

    快速枚举是Objective-C的功能,用于枚举集合. 因此,要了解快速枚举,首先需要了解集合,这将在下一节中进行说明. 1. Objective-C集合 集合是基本结构.它用于保存和管理其他对象. ...

  3. Cannot determine embedded database driver class for database type NONE

    springboot+jpa使用自定义配置文件连接数据库报错:Cannot determine embedded database driver class for database type NON ...

  4. 04-TypeScript中的方法新功能(上)

    在TypeScript中,提供了一些函数的新功能,能够简化JavaScript中的一些比较复杂代码才能实现的一些能力. 在C#后端语言中,能够对方法传递的参数指定params关键字,也就是可以传递任意 ...

  5. Storm 入门教程

    在这个教程中,你将学会如何创建 Storm 的topology并将他们部署到 Storm 集群上, 主要的语言是 Java,但是少数几个例子用 Python 编写来说明 Storm 的多语言支持能力. ...

  6. SpringBoot之使用Lettuce集成Redis

    一.Lettuce Redis这里就不多说,服务端的启动之前的博客里面也有提到,这里略过.Lettuce和Jedis都是连接Redis Server的客户端程序,Jedis在实现上是直连redis s ...

  7. Vim——回顾整理

    一.命令练习(一) hjkl(左下上右) 保存到某路径 :saveas 路径 w 到下一个单词的开头 e 到下一个单词的结尾 % 括号匹配移动(),{},[] 0 到行头 $ 到行头 gU字母变大写 ...

  8. [转]来扯点ionic3[2] 页面一线牵 珍惜这段缘

    本文转自:https://www.jianshu.com/p/de40aeb3d371 往期传送门 来扯点ionic3[0] 吹完牛再入门也不迟 来扯点ionic3[1] 创建一个新页面     上一 ...

  9. link rel=alternate网站换肤功能

    此方法借助HTML rel属性的alternate属性值实现. <link href="reset.css" rel="stylesheet" type= ...

  10. Spring Boot 初始化运行特定方法

    Spring Boot提供了两种 “开机自启动” 的方式,ApplicationRunner和CommandLineRunner 这两种方式的目的是为了满足,在容器启动时like执行某些方法.我们可以 ...