Loading [MathJax]/jax/output/CommonHTML/config.js
前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >nodejs学习一CommonJS和AMD

nodejs学习一CommonJS和AMD

作者头像
空空云
发布于 2018-09-27 03:59:11
发布于 2018-09-27 03:59:11
70200
代码可运行
举报
文章被收录于专栏:大前端_Web大前端_Web
运行总次数:0
代码可运行

版权声明:本文为吴孔云博客原创文章,转载请注明出处并带上链接,谢谢。 https://cloud.tencent.com/developer/article/1347597

模块化设计,一个模块化系统所必须的能力: 1. 定义封装的模块。 2. 定义新模块对其他模块的依赖。 3. 可对其他模块的引入支持。

CommonJS

CommonJS本质上就是一个规范,它并不提供默认实现,而是要求一些JavaScript库、框架、环境……去实现它的这些API定义。

那么,都有哪些API层面的定义呢?

1.Uniform Baseline / Globals (discussion)

2.Modules (1.1.1)

  • binary: Binary Data Objects (byte arrays and/or strings) (proposals, discussion, early implementations)
  • encodings: Encodings and character sets (proposals, discussion, early implementations)
  • io: I/O Streams (proposals, discussion)
  • fs, fs-base: Filesystem (proposals, discussion, early implementations)
  • system: System Interface (stdin, stdout, stderr, &c) (1.0, amendments proposed)
  • assert, test: Unit Testing (1.0, amendment proposals pending)
  • sockets: Socket I/O TCP/IP sockets (early proposals)
  • event-queue: Reactor Reactor/Event Queue (early proposals)
  • worker: Worker Worker (concurrent shared nothing process/thread) (proposal)
  • console: console (proposal)

3.Packages (1.0)

4.Package Mappings (proposal)

5.Web Server Gateway Interface (JSGI) (proposals, discussion, early implementations)

6.Promises (proposal)

modules涉及到二进制、编码、IO、文件、系统、断言测试、套接字、事件队列、Worker、控制台等等实现,恰恰弥补的传统JavaScript的空白。

CommonJS定义的模块分为:{模块引用(require)} {模块定义(exports)} {模块标识(module)}, require()用来引入外部模块;exports对象用于导出当前模块的方法或变量,唯一的导出口;module对象就代表模块本身。

node.js的模块系统,就是参照CommonJS规范实现的。在CommonJS中,有一个全局性方法require(),用于加载模块。假定有一个数学模块math.js,就可以像下面这样加载。

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
var math = require('math');
//然后,就可以调用模块提供的方法:
var math = require('math');
math.add(2,3); // 5

AMD

CommonJS规范不适用于浏览器环境。还是上一节的代码,如果在浏览器中运行,会有一个很大的问题,你能看出来吗?

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
 var math = require('math');
  math.add(2, 3);

第二行math.add(2, 3),在第一行require(‘math’)之后运行,因此必须等math.js加载完成。也就是说,如果加载时间很长,整个应用就会停在那里等。

这对服务器端不是一个问题,因为所有的模块都存放在本地硬盘,可以同步加载完成,等待时间就是硬盘的读取时间。但是,对于浏览器,这却是一个大问题,因为模块都放在服务器端,等待时间取决于网速的快慢,可能要等很长时间,浏览器处于”假死”状态。

因此,浏览器端的模块,不能采用”同步加载”(synchronous),只能采用”异步加载”(asynchronous)。这就是AMD规范诞生的背景。

AMD是”Asynchronous Module Definition”的缩写,意思就是”异步模块定义”。它采用异步方式加载模块,模块的加载不影响它后面语句的运行。所有依赖这个模块的语句,都定义在一个回调函数中,等到加载完成之后,这个回调函数才会运行。

AMD也采用require()语句加载模块,但是不同于CommonJS,它要求两个参数:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
  require([module], callback);

第一个参数module,是一个数组,里面的成员就是要加载的模块;第二个参数callback,则是加载成功之后的回调函数。如果将前面的代码改写成AMD形式,就是下面这样:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
  require(['math'], function (math) {
    math.add(2, 3);
  });

math.add()与math模块加载不是同步的,浏览器不会发生假死。所以很显然,AMD比较适合浏览器环境。

目前,主要有两个Javascript库实现了AMD规范:require.js和curl.js。

参考文档:

1.wiki-CommonJS

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2016年04月25日,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
Javascript模块化编程(二):AMD规范
这个系列的第一部分介绍了Javascript模块的基本写法,今天介绍如何规范地使用模块。 (接上文) 七、模块的规范 先想一想,为什么模块很重要? 因为有了模块,我们就可以更方便地使用别人的代码,想要什么功能,就加载什么模块。 但是,这样做有一个前提,那就是大家必须以同样的方式编写模块,否则你有你的写法,我有我的写法,岂不是乱了套!考虑到Javascript模块现在还没有官方规范,这一点就更重要了。 目前,通行的Javascript模块规范共有两种:CommonJS和AMD。我主要介绍AMD,
汤高
2018/03/28
1.1K0
js模块化编程之彻底弄懂CommonJS和AMD/CMD!(转)
答:因为有了模块,我们就可以更方便地使用别人的代码,想要什么功能,就加载什么模块。 但是,这样做有一个前提,那就是大家必须以同样的方式编写模块,否则你有你的写法,我有我的写法,岂不是乱了套!
jojo
2019/03/12
1.7K0
CommonJS
老实说,之前我对 CommonJS 也是一无所知,直到不久前 Node.js 火起来,我去研究它,才了解到 Node.js 其实是 CommonJS 的一个部分实现,我才关注起 CommonJS 来。
四火
2022/07/15
3810
CommonJS
JS模块化编程以及AMD、CMD规范、Webpack
由于CommonJS和AMD都十分流行,但似乎缺少一个统一的规范。于是,UMD(通用模块规范)出现了,它可以同时支持这两种风格。
房东的狗丶
2023/02/17
2.4K0
前端模块化:CommonJS,AMD,CMD,ES6
模块化的开发方式可以提高代码复用率,方便进行代码的管理。通常一个文件就是一个模块,有自己的作用域,只向外暴露特定的变量和函数。目前流行的js模块化规范有CommonJS、AMD、CMD以及ES6的模块系统。参见阮一峰老师的文章 module-loader 。
4O4
2022/04/25
5520
前端模块化:CommonJS,AMD,CMD,ES6
模块化的开发方式可以提高代码复用率,方便进行代码的管理。通常一个文件就是一个模块,有自己的作用域,只向外暴露特定的变量和函数。目前流行的js模块化规范有CommonJS、AMD、CMD以及ES6的模块系统。参见阮一峰老师的文章 module-loader[1] 。
五月君
2020/08/20
1.3K0
前端模块化:CommonJS,AMD,CMD,ES6
一览js模块化:从CommonJS到ES6
js模块化规范有:CommonJS、AMD、CMD、ES6的模块系统。本文将依次介绍下每个规范。
前端林子
2018/12/22
4K0
一览js模块化:从CommonJS到ES6
AMD && CMD
随着web2.0时代的到来,Ajax技术得到广泛应用,jQuery等前端库层出不穷,前端代码日益膨胀
超然
2018/08/03
1.9K0
requireJS
requireJS(http://www.requirejs.cn/)是一个JavaScript模块加载器。它非常适合在浏览器中使用,使用RequireJS加载模块化脚本将提高代码的加载速度和质量。
奋飛
2019/08/15
1.8K0
一文搞懂 JavaScript 模块化规范:CommonJS、AMD、ES6 Module
在前端开发的历史中,模块化一直是一个核心的问题。随着 JavaScript 应用程序变得越来越复杂,代码的可维护性、复用性和模块化的需求也越来越迫切。
空白诗
2024/09/09
6490
一文搞懂 JavaScript 模块化规范:CommonJS、AMD、ES6 Module
JavaScript模块化发展
简介 在最开始学习前端的时候只需要一个js文件就能玩转一个小的练手应用,但是随着自己不断的学习,ajax、jQuery等广泛应用,使得我们的代码量变得巨大,代码变得格外的混乱。现在迫切的需要我们将大段的代码分离开来。 前端最开始并没有像java中package概念以及import那样的引包工具。JavaScript源生代码是在ES6的时候才正式的引入import这个API,来调用其他文件。在这之前也同样出现了很多社区来实现模块化开发。 ---- 发展历程 注意下面会讲历史上面出现的一些类库,有一些现在已经没
pitaojin
2018/05/25
1.7K0
关于 JS 模块化的最佳实践总结
模块化开发是 JS 项目开发中的必备技能,它如同面向对象、设计模式一样,可以兼顾提升软件项目的可维护性和开发效率。
LIYI
2019/09/02
2.5K0
前端模块化
js本身的问题: 不具有模块化的语法规则,在语言层面没有命名空间。 JavaScript 编程过程中很多时候,我们都在修改变量,在一个复杂的项目开发过程中,如何管理函数和变量作用域,显得尤为重要。
前端小tips
2021/12/10
5050
前端模块化
Javascript AMD模块化规范-备用
AMD是”Asynchronous Module Definition”的缩写,意思是”异步模块定义”。
全栈程序员站长
2022/07/05
5770
写给前端新手看的一些模块化知识
一、 为什么需要模块化 以前没有模块化时,我们可能会按如下方式划分模块: 通过 <script> 标签引入各个文件,把每个文件看成是一个模块,每个模块的接口通常是暴露在全局作用域下的,也就是定义在 window 对象中。 <script src="module1.js"></script> <script src="module2.js"></script> <script src="module3.js"></script> 如果通过这种方式做模块化,当项目变得越来越大时,很容易造成全局变量冲突,项目也会
用户1097444
2022/06/29
3300
写给前端新手看的一些模块化知识
CommonJS——
CommonJS(http://www.commonjs.org/)规范为JavaScript制定了一个美好的愿景——希望JavaScript能够在任何地方运行。
奋飛
2019/08/15
5870
Node入门教程(7)第五章:node 模块化(下) npm与yarn详解
Node的包管理器 JavaScript缺少包结构的定义,而CommonJS定义了一系列的规范。而NPM的出现则是为了在CommonJS规范的基础上,实现解决包的安装卸载,依赖管理,版本管理等问题。 CommonJS是一个致力于构建统一的JS生态系统,它可以兼容web服务器、桌面应用、命令行应用、浏览器等。它定义了各种开发的规范和API不仅仅模块化相关的规范) 官网的说明: a group with a goal of building up the JavaScript ecosystem for we
老马
2018/04/16
1.1K0
JS模块化和使用
CommonJS API定义很多普通应用程序(主要指非浏览器的应用)使用的API,从而填补了这个空白。 它的终极目标是提供一个类似Python,Ruby和Java标准库。 这样的话,开发者可以使用CommonJS API编写应用程序,然后这些应用可以运行在不同的JavaScript解释器和不同的主机环境中。
我不是费圆
2020/09/21
1.7K0
JS模块化和使用
前端模块化杂记 前言AMD/CMD简介Commonjs简介Module简介Common和Module的区别Module与webpackModule与Babel一些问题总结引用
前端模块化在近几年层出不穷,有Node的CommonJs,也有属于client端的CMD/AMD模式,而ES6本身也出现了Modules,再加上Webpack以及babel的普及,虽然在代码中经常使用到这些用法,但是如果不去深入研究,总觉得是一个黑魔法,无法探测一些问题的根源。
菜的黑人牙膏
2019/01/28
8980
JavaScript模块化-CommonJS、AMD、CMD、UMD、ES6
AMD(Asynchronous Module Definition)异步模块定义,客户端规范。采用异步方式加载模块,模块加载不影响它后面语句的代执行。
胡哥有话说
2020/04/14
8830
相关推荐
Javascript模块化编程(二):AMD规范
更多 >
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
本文部分代码块支持一键运行,欢迎体验
本文部分代码块支持一键运行,欢迎体验