模块化规范Common.js,AMD,CMD
随着网站规模的不断扩大,嵌入网页中的javascript代码越来越大,开发过程中存在大量问题,如:协同开发,代码复用,大量文件引入,命名冲突,文件依赖。
模块化编程称为迫切的需求。
所谓的模块,就是实现特定功能的一组方法。
1. 模块的发展
1)函数封装
// 存在问题:污染全局变量,模块成员之间看不出直接关系
function add(x, y) {
return x + y;
}
2)对象封装
// 存在问题:暴露模块中的成员,可以被修改
var math = {
add: function(x, y) {
return x + y;
}
}
3)立即执行函数
// 没有暴露私有成员,模块化基本写法
var math = (function() {
var add = function(x, y) {
return x + y;
}
return {
add: add;
}
})();
我们根据实际情况,可以设置传入参数,为模块添加方法。
// 为传入的模块中添加方法,并返回,如果是空对象,创建一个空对象,添加方法返回。
var module = (function(module) {
module.add = function(x, y) {
return x + y;
}
return module;
})(module || {});
2. 模块化规范
1)Common.js
common.js规范是服务器端的模块化规范,它使用的是同步加载的方式,必须模块加载完之后,才可以使用模块中的方法。
// 加载模块
var math = require('math');
// 使用模块中的方法
math.add(x, y);
2) AMD(Asynchronous Module Definition)
对于浏览器而言,这样会造成页面失去响应。因此Common.js模块定义规范并不适用于浏览器端。因此AMD出现了。
AMD采用的是异步加载的方式,当模块加载完毕,调用传入的回调函数。在加载的过程中,继续执行之后的代码,不会阻塞页面渲染。
// module是要加载模块,回调函数中编写处理逻辑
require([module], function (module) {
...
});
AMD解决两个问题:
1)实现js文件的异步加载,避免网页失去响应
2)管理模块之间的依赖问题,便于代码的编写和维护
AMD规范网址:https://github.com/amdjs/amdjs-api/wiki/AMD
3) CMD(Common Module Definition)
CMD通用模块定义规范,和AMD都实现浏览器端模块化开发的目的。只是AMD提供了后端发展的方式。
CMD规范网址:https://github.com/seajs/seajs/issues/242
模块化规范Common.js,AMD,CMD的更多相关文章
- JS模块化规范CommonJS,AMD,CMD
模块化是软件系统的属性,这个系统被分解为一组高内聚,低耦合的模块.理想状态下我们只需要完成自己部分的核心业务逻辑代码,其他方面的依赖可以通过直接加载被人已经写好模块进行使用即可.一个模块化系统所必须的 ...
- Javascript模块化编程之CommonJS,AMD,CMD,UMD模块加载规范详解
JavaSript模块化 在了解AMD,CMD规范前,还是需要先来简单地了解下什么是模块化,模块化开发? 模块化是指在解决某一个复杂问题或者一系列的杂糅问题时,依照一种分类的思维把问 题进行系 ...
- JS 模块化 - 02 Common JS 模块化规范
1 Common JS 介绍 Common JS 是模块化规范之一.每个文件都是一个作用域,文件里面定义的变量/函数都是私有的,对其他模块不可见.Common JS 规范在 Node 端和浏览器端有不 ...
- 研究一下javascript的模块规范(CommonJs/AMD/CMD)
最近写react需要使用nodejs作为开发环境,需要通过npm安装一些第三方的依赖库,因此慢慢感觉到nodejs基础薄弱对我带来了一些不安全感,尤其是javascript模块这一块听到了很多概念,比 ...
- 前端模块化之CommonJS,ES6,AMD,CMD
最近在搞跨平台解决方案,讨论关于模块划分的问题以及如何尽量多的复用逻辑代码.于是就有了此文章,之前的博客也写过,不过由于主机商跑路,宝贵的资源也就没了,说多了都是泪~ 这里按模块化发展的历史回溯的时间 ...
- 前端模块化小总结—commonJs,AMD,CMD, ES6 的Module
随着前端快速发展,需要使用javascript处理越来越多的事情,不在局限页面的交互,项目的需求越来越多,更多的逻辑需要在前端完成,这时需要一种新的模式 --模块化编程 模块化的理解:模块化是一种处理 ...
- js模块化编程之CommonJS和AMD/CMD
js模块化编程commonjs.AMD/CMD与ES6模块规范 一.CommonJS commonjs的require是运行时同步加载,es6的import是静态分析,是在编译时而不是在代码运行时.C ...
- javascript模块化之CommonJS、AMD、CMD、UMD、ES6
javascript模块化之CommonJS.AMD.CMD.UMD.ES6 一.总结 一句话总结: CommonJS是同步加载模块,用在服务端:AMD是异步加载模块,用于浏览器端 1.为什么服务器端 ...
- 前端模块化——彻底搞懂AMD、CMD、ESM和CommonJS
我们知道,在NodeJS之前,由于没有过于复杂的开发场景,前端是不存在模块化的,后端才有模块化.NodeJS诞生之后,它使用CommonJS的模块化规范.从此,js模块化开始快速发展. 模块化的开发方 ...
随机推荐
- Android注解学习(2)
最近考试周没什么时间写,回归正题.前面的一次简单的讲了关于注解的的基础部分,这一次分析xutils注解封装的源码(奉上github源码). 补充下:xUtils 2.x对Android 6.0兼容不是 ...
- SpringMVC简版教程、部分功能
注:本文只用注解来实现 前言 SpringMVC各种流程图流程图(其他的各种流程图) jsp.xml.action彼此之间的关系,都如何使用 spring-mvc.xml如何配置,放在哪里? acti ...
- ReactJS的开发日常
在用React框架开发的日子里,踩的坑真不少!今天就来说说这个关于组件的周期,说的可能不是很清楚,但是也给自己留下一个踩坑的纪念,如有不妥 还望大家指点一二 Warning: setState(... ...
- Python2.7学习笔记-定义函数、filter/map/reduce/lambda
我把写的代码直接贴在下面了,注释的不是很仔细,主要是为了自己复习时方便查找,并不适合没有接触过python的人看,其实我也是初学者. #定义函数 def my_abs(x): if x>=0: ...
- jquery.validate提示错误方法
修改jquery.validate提示错误方法,将错误信息用弹出框提示 <script src="@Url.Content("~/Scripts/jquery.validat ...
- 每天一个Linux命令(10)--cat命令
--首先,恭喜你,这是第十个命令啦. --为啥第十个就要恭喜?没啥特别呀? --因为逢十进一啊! cat命令的用途是连接文件或标准输入并打印.这个命令常用来显示文件内容,或者将几个文件连接起来显示,或 ...
- php调去存储过程
第一步,mysql端建存储过程 DELIMITER $$create procedure mintime()beginselect min(year(htime)) as minnian,max(ye ...
- 最近新版本的pangolin出现了点问题,我把可用的旧版本上传到了github
经测试该版本编译没有问题. 下载地址:https://github.com/zzx2GH/Pangolin.git
- sqlserver的一些小知识点
1.高效分页sql和储存过程 select top 每页条数 * from ( select ROW_NUMBER() over (order by id)as nid ,* from table01 ...
- Java对象序列化的使用和定制
序列化的概念及使用场合 序列化就是把对象转化为字节序列并持久化保存,可以保存在内存中.磁盘文件系统,甚至通过网络传递,并能够在以后将这个字节序列完全恢复为原来的对象. 对象序列化的概念引入Java是为 ...