from:https://www.jianshu.com/p/09ffac7a3b2c

随着JS模块化编程的发展,处理模块之间的依赖关系成为了维护的关键。

 
模块化

AMD,CMD,CommonJS是目前最常用的三种模块化书写规范。

CommonJS

CommonJS规范是诞生比较早的。NodeJS就采用了CommonJS。是这样加载模块:

var clock = require('clock');
clock.start();

这种写法适合服务端,因为在服务器读取模块都是在本地磁盘,加载速度很快。但是如果在客户端,加载模块的时候有可能出现“假死”状况。比如上面的例子中clock的调用必须等待clock.js请求成功,加载完毕。那么,能不能异步加载模块呢?

1、CommonJs规范的出发点:JS没有模块系统、标准库较少、缺乏包管理工具;为了让JS可以在任何地方运行,以达到Java、C#、PHP这些后台语言具备开发大型应用的能力;

2、在CommonJs规范中:

一个文件就是一个模块,拥有单独的作用域;

普通方式定义的变量、函数、对象都属于该模块内;

通过require来加载模块;

通过exports和modul.exports来暴露模块中的内容;

3、所有代码都运行在模块作用域,不会污染全局作用域;模块可以多次加载,但只会在第一次加载的时候运行一次,然后运行结果就被缓存了,以后再加载,就直接读取缓存结果;模块的加载顺序,按照代码的出现顺序是同步加载的;

4、__dirname代表当前模块文件所在的文件夹路径,__filename代表当前模块文件所在的文件夹路径+文件名;

5、require(同步加载)基本功能:读取并执行一个JS文件,然后返回该模块的exports对象,如果没有发现指定模块会报错;

6、模块内的exports:为了方便,node为每个模块提供一个exports变量,其指向module.exports,相当于在模块头部加了这句话:var exports = module.exports,在对外输出时,可以给exports对象添加方法,PS:不能直接赋值(因为这样就切断了exports和module.exports的联系);

7、npm root -g:查看npm全局包安装位置,建议在nvm目录下新建npm\node_modules目录,然后设置npm的全局包安装位置:npm config set prefix "",然后将该路径添加到环境变量中;

8、npm init -y:初始化一个package.json文件,加上-y就会默认生成该文件,无需一步一步填写;npm docs 包名:查看包的文档;npm install:安装package.json中dependencies属性中所有依赖的包

9、由于npm的服务器是国外的,所以如果你没有和谐工具是下载不了的,这里推荐使用淘宝NPM镜像:http://npm.taobao.org/,与官方NPM的同步频率目前为10分钟一次;安装命令:npm install -g cnpm --registry=https://registry.npm.taobao.org,安装包:cnpm install 包名(其它命令基本一致);

10、如果你不想下载cnpm,npm还提供了一个镜像源管理工具:npm install -g nrm,通过:nrm ls,查看镜像源列表 ,通过:npm use 镜像源,来切换;

11、NPM的模块加载机制:

如果require的是绝对路径文件,查找不会去遍历每个node_modules目录,其速度最快

  1).从module.paths数组中(由当前执行文件目录到磁盘根目录)取出第一个目录作为查找基准

  2).直接从目录中查找该文件,如果存在则结束查找,如果不存在则进行下一条查找

  3).尝试添加.js、.node、.json后缀之后查找,如果存在文件则结束查找,如果不存在则进行下一条查找

  4).尝试将require的参数作为一个包来进行查找,读取目录下的package.json文件,取得Main参数指定的文件

  5).尝试查找该文件,如果存在则结束查找,如果不存在则进行第3条查找

  6).如果继续失败,则取出module.paths数组中的下一目录作为基准查找,循环第1-5个步骤

  7).如果继续失败,循环第1-6个步骤,直到module.paths中的最后一个值

  8).如果继续失败,则抛出异常

AMD

AMD,即 (Asynchronous Module Definition),这种规范是异步的加载模块,requireJs应用了这一规范。先定义所有依赖,然后在加载完成后的回调函数中执行:

require([module], callback);

用AMD写上一个模块:

require(['clock'],function(clock){
clock.start();
});

AMD虽然实现了异步加载,但是开始就把所有依赖写出来是不符合书写的逻辑顺序的,能不能像commonJS那样用的时候再require,而且还支持异步加载后再执行呢?

CMD

CMD (Common Module Definition), 是seajs推崇的规范,CMD则是依赖就近,用的时候再require。它写起来是这样的:

define(function(require, exports, module) {
var clock = require('clock');
clock.start();
});

AMD和CMD最大的区别是对依赖模块的执行时机处理不同,而不是加载的时机或者方式不同,二者皆为异步加载模块。
AMD依赖前置,js可以方便知道依赖模块是谁,立即加载;而CMD就近依赖,需要使用把模块变为字符串解析一遍才知道依赖了那些模块,这也是很多人诟病CMD的一点,牺牲性能来带来开发的便利性,实际上解析模块用的时间短到可以忽略。

以上就是三者的异同,如有疑问或建议,请参考以下文章或联系我,谢谢。
</br></br>


作者:乘着风
链接:https://www.jianshu.com/p/09ffac7a3b2c
來源:简书
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

最新文章

  1. express 4 中 session的处理(仅为博主笔记)
  2. yum安装mysql后没有mysqld
  3. Oracle数据库ORA-12154: TNS: 无法解析指定的连接标识符详解
  4. jquery 动态添加下拉框 需要增加 煊染 selectmenu(&quot;refresh&quot;);
  5. 【HDU 3435】 A new Graph Game (KM|费用流)
  6. Visual studio 2015程序转Eclipse gun编译出现的问题总结
  7. window.onload()与$(document).ready()区别
  8. HDU 2498 Digits
  9. Maven的作用是什么
  10. Centos常用命令之:搜索
  11. Invalid character found in method name. HTTP method names must be tokens
  12. Python机器学习步骤
  13. Powershell中显示隐藏文件
  14. SpringBoot + JPA 连接MySQL完整实例(一)
  15. strlen()与mb_strlen()的区别
  16. AngularJS入门之数据绑定
  17. 十二.jQuery源码解析之.eq().first().last().slice()
  18. 远程登录linux上的mysql数据库
  19. King&#39;s Game---hdu5643(约瑟夫环)
  20. li布局问题

热门文章

  1. linux分区之gpt(大于2T的分区)
  2. 为什么要学习php
  3. 没有无线路由,如何让手机使用电脑的网络xyytit
  4. TZOJ 4839 麦森数(模拟快速幂)
  5. sqlserver 字符串拆分和取某分隔符之前的字符串
  6. centos7下mysql5.6的主从复制
  7. Halcon中数据的四舍五入、取整、有效数字以及和字符串之间的转换
  8. JS如何获取PHP循环中的ID
  9. python while语句写法
  10. Laravel Eloquent Model-&gt;isDirty() Function