CommonJS 和 AMD

柯里涟漪
• 阅读 1649

对于前端开发者来说 CommonJS 和 AMD 是经常遇到的概念,那么 CommonJS 和 AMD 到底是什么呢?

CommonJS

CommonJS is a project with the goal of specifying an ecosystem for JavaScript outside the browser (for example, on the server or for native desktop applications).

维基百科说,CommonJS 是一个致力于规范化浏览器之外的 JavaScript 生态系统的项目(例如,在服务器端或者是原生的桌面应用程序)。

简单来讲,它是一个规范。根据这个规范,每个文件就是一个模块,有自己的作用域。在一个文件里面定义的变量、函数、类,都是私有的,对其他文件不可见。CommonJS 规范规定,每个模块内部,module变量代表当前模块。这个变量是一个对象,它的exports属性(即module.exports)是对外的接口。加载某个模块,其实是加载该模块的module.exports属性。

CommonJS 加载模块是同步的,所以只有加载完成才能执行后面的操作。像Node.js主要用于服务器的编程,加载的模块文件一般都已经存在本地硬盘,所以加载起来比较快,不用考虑异步加载的方式,所以CommonJS规范比较适用。但如果是浏览器环境,要从服务器加载模块,这是就必须采用异步模式。所以就有了 AMD,CMD 解决方案。

AMD(Asynchromous Module Definition)

CommonJS是主要为了js在后端的表现制定的,是不适合前端的,为什么这么说呢?这需要分析一下浏览器端的js和服务器端js都主要做了哪些事,有什么不同了:

CommonJS 和 AMD

于是乎,AMD(异步模块定义)出现了,它就主要为前端JS的表现制定规范。
AMD就只有一个接口:

define(id?,dependencies?,factory)

它要在声明模块的时候制定所有的依赖(dependencies),并且还要当做形参传到factory中,像这样:

define(['./a', './b'], function(a, b) { // 依赖必须一开始就写好
    a.doSomething()
    // 此处略去 100 行
    b.doSomething()
    ...
})

参考链接

1. JavaScript 标准参考教程(alpha)
2. amdjs/amdjs-api

点赞
收藏
评论区
推荐文章
待兔 待兔
1年前
手写Java HashMap源码
HashMap的使用教程HashMap的使用教程HashMap的使用教程HashMap的使用教程HashMap的使用教程22
js 理解模块化
经常在面试或者其他文章看到关于模块化的问题,之前也只是寥寥看了几次,对于CommonJS,AMD,ES6也说不出个所以然,于是今天抽空好好看了红宝书第4版关于模块化的介绍,这里记录一下。理解模块模式初衷在开发中肯定有设计大量三方库或者业务逻辑代码,较好的方式是将其分割为多个小模块,最后以一定的方式连接起来
Stella981 Stella981
3年前
JS 中的require 和 import 区别
在研究react和webpack的时候,经常看到在js文件中出现require,还有import,这两个都是为了JS模块化编程使用。CSS的是@import1.ES6模块的设计思想,是尽量的静态化,使得编译时就能确定模块的依赖关系,以及输入和输出的变量。Require是CommonJS的语法,CommonJS的模块是对象,输入时
Wesley13 Wesley13
3年前
ES6模块与CommonJS模块有什么区别?
ES6Module和CommonJS模块的区别:CommonJS是对模块的浅拷贝,ES6Module是对模块的引用,即ES6Module只存只读,不能改变其值,具体点就是指针指向不能变,类似constimport的接口是readonly(只读状态),不能修改其变量值。即不能修改其变量的指针指向,但可以改变变量内部指针指向,可以对comm
Wesley13 Wesley13
3年前
CommonJS,ES2015,AMD,CMD区别
本文你将学到:1.Rollup是什么2.CommonJS、AMD、CMD、UMD、ES6分别的介绍3.ES6模块与CommonJS模块的区别4.模块演进的产物——TreeShaking5.TreeShaking应该注意什么本文所有例子都存放于https://github.com/hua1995116
Stella981 Stella981
3年前
ES6 模块化(Module)export和import详解
ES6模块化(Module)export和import详解ES6在语言标准的层面上,实现了模块功能,而且实现得相当简单,完全可以取代现有的CommonJS和AMD规范,成为浏览器和服务器通用的模块解决方案。ES6模块的设计思想,是尽量的静态化,使得编译时就能确定模块的依赖关系,以及输入和输出的变量。CommonJS和AMD模块,都只能
Stella981 Stella981
3年前
CommonJs 与 AMD 与 requirejs
CommonJS规范主要解决服务端中library的导入导出问题。NodeJS(同时也包括webpack与npm)是CommonJS规范的实现由于CommonJS规范引入依赖的方式是同步的,而在浏览器端需要进行异步加载,因此创建了AMD规范用于浏览器端管理依赖问题。require.js是AMD规范的一管实现。U
Stella981 Stella981
3年前
AMD和Intel的CPU对比
http://www.lotpc.com/yjzs/5825.html(https://www.oschina.net/action/GoToLink?urlhttp%3A%2F%2Fwww.lotpc.com%2Fyjzs%2F5825.html)推荐文章:小白看AMD与intel的cpu架构,AMD慢的原因(https://www.osch
Wesley13 Wesley13
3年前
@JavaScript程序员,如何写出令人惊叹的高级代码?
△是新朋友吗?记得先点web前端学习圈关注我哦~!(https://oscimg.oschina.net/oscnet/332f31ec504043fa90fa06a0b296c308.jpg)各种包管理器到ESLint,从CommonJS到AMD,再从ES6模块到Babel和Webpack,好多工具啊!!(http
京东云开发者 京东云开发者
9个月前
前端技术探秘-Nodejs的CommonJS规范实现原理
作者:京东物流乔盼盼了解Node.jsNode.js是一个基于ChromeV8引擎的JavaScript运行环境,使用了一个事件驱动、非阻塞式I/O模型,让JavaScript运行在服务端的开发平台,它让JavaScript成为与PHP、Python、Pe