AMD、CMD、CommonJs和ES6对比
一、AMD(异步模块定义)
AMD(异步模块定义)是RequireJS在推广过程中对模块定义的规范化产出。AMD是一个概念,RequireJs是对这个概念的实现。比如javascript语言是对ECMAscript语言的实现,ECMAscript是一个组织,RequireJS是这个组织之下制定的一套脚本语言。
// 异步的动态的加载js文件
// 依赖别的库,通过数组形式加载库进来['package/lib']
## define定义,依赖lib库,通过['package/lib']加载这个库,通过回调函数接受lib参数,可以得到lib里面的一下方法
define(['package/lib'], function(lib){
function foo(){
lib.log("hello world!")
}
return { // return输出
foo:foo
}
})
引用的话通过require就可以加载。就是异步模块定义,称为依赖前置(依赖或需要的时候在最上面定义好)
二、CMD(同步模块定义)
CMD(同步模块定义)是SeaJS(淘宝团队)在推广过程中对模块定义的规范化产出。
// 所有模块都通过define来定义
define(function(require, exports, module){
// 通过require引入依赖
var $ = require('jquery');
var Spinning = require('./spinning');
}) 依赖就近(什么时候使用,就什么时候引进来),即用即返回
三、CommonJS规范
CommonJS规范-module.exports 是服务端nodeJs后端支持的规范,前端浏览器不支持CommonJS规范。
是服务端进行模块划分的方式
exports.area = function(r){
return Math.PI * r * r;
}
exports.circumference = function(r){
return 2 * Math.PI * r;
}
两种输出方式:
module.exports 没有名字的命名输出
exports 带有有名字的输出
四、ES6特性 export/import 导出/导入
export default{} // 默认导出
import router from './router' // 导入
export function formatDate(date, fmt) {} // 向浏览器暴露这个方法
import { format } from 'common/js/utils' // 导入
export let sum = (x,y)=>{ return x+y }
import * as util from './util' // 通过*封装起来
console.log(`sum:${util.sum(1,6)}`) 相当于:
define('util',function(){
return {
sum:function(){ },
minus:function(){ }
}
})
methods:{
increment(){
this.$emit("incre");
import('./../util') // 异步加载 与require('...')一样的
}
}
AMD、CMD、CommonJs和ES6对比的更多相关文章
- 深度扫盲JavaScript的模块化(AMD , CMD , CommonJs 和 ES6)
原文地址 https://blog.csdn.net/haochangdi123/article/details/80408874 一.commonJS 1.内存情况 对于基本数据类型,属于复制.即会 ...
- js模块系统 - amd|cmd|commonjs|esm|umd
写过前端代码大概率听说过amd cmd umd commonjs esm这些名词, 想当初我第一次看到这些的时候, 人都麻了, 都是些啥啊. 后来我知道了, 这些都是js的模块规范. amd - 浏览 ...
- AMD/CMD/CommonJs到底是什么?它们有什么区别?
知识点1:AMD/CMD/CommonJs是JS模块化开发的标准,目前对应的实现是RequireJs/SeaJs/nodeJs. 知识点2:CommonJs主要针对服务端,AMD/CMD主要针对浏 ...
- FW: AMD, CMD, CommonJS和UMD
javascript 我是豆腐不是渣 4月5日发布 推荐 2 推荐 收藏 32 收藏,486 浏览 今天由于项目中引入的echarts的文件太大,requirejs经常加载超时,不得不分开来加载ech ...
- AMD, CMD, CommonJS和UMD
我的Github(https://github.com/tonyzheng1990/tonyzheng1990.github.io/issues),欢迎star 今天由于项目中引入的echarts的文 ...
- AMD,CMD.CommonJs和UMD还有es6的模块化对比
CommonJS CommonJS是服务器端模块的规范,Node.js采用了这个规范. 根据CommonJS规范,一个单独的文件就是一个模块.加载模块使用require方法,该方法读取一个文件并执行, ...
- JS模块之AMD, CMD, CommonJS、UMD和ES6模块
CommonJS 传送门 同步加载,适合服务器开发,node实现了commonJS.module.exports和require 判断commonJS环境的方式是(参考jquery源码): if ( ...
- AMD CMD commonJS es6
看到很多人傻傻的分不清楚 AMD.CMD . commonJS . es6的区别,实际上这跟这几年前段技术的发展有很大的关系. 实际上这是JavaScript的模块化思想演进的一个过程. 最开始的时候 ...
- js模块化开发 AMD CMD Commonjs
在es6全面实行开来之前 js实现模块开发方案有: 1.AMD 异步模块开发定义 依赖前置,requireJs应用了这一规范 require([module], callback); 加载完后回调 ...
- AMD、CMD、CommonJs和 ES6对比
AMD(异步模块定义)是RequireJS在推广过程中对模块定义的规范化产出. define(['package/lib'], function(lib){ function foo(){ lib.l ...
随机推荐
- g++ 出现 undefined reference to ......
g++ 出现 undefined reference to ...... 检查/usr/local/lib /usr/lib 发现已经存在相应的库文件 那么,问题可能出现在g++链接次序上,即先链接 ...
- [转]关于Jquery的DataTables里TableTools的应用
本文转自:http://147068307.iteye.com/blog/1700516 最近在产品中使用了TableTools这个工具,主要用来实现导出和复制功能. 但是在实际的运用中出现了以下相关 ...
- 牛客网Java刷题知识点之匿名对象、匿名对象的内存结构图、匿名对象的应用场景、匿名对象的使用、匿名对象的简单例子、匿名对象要注意的事项
不多说,直接上干货! 什么是匿名对象? 答: 没有名字的实体,也就是该实体没有对应的变量名引用. 没有名字的实体,没有引用类型变量指向的对象称作为匿名对象. 正常的,是 Car car = new ...
- & 和nohup使用
" & "的使用 将工作丢到背景(这里指的背景并非是系统的背景,指的是在终端模式下,可以避免ctrl+c中断的一个情景)中去执行(但是如果终端关闭时,程序也就退出了,这时 ...
- HDU 4578——Transformation——————【线段树区间操作、确定操作顺序】
Transformation Time Limit: 15000/8000 MS (Java/Others) Memory Limit: 65535/65536 K (Java/Others)T ...
- Unity C# 用枚举(enum)制作复选框
最近在项目中做测试脚本用到一些布尔值做方法的开关,突然想到可以制作一个复选框控制开关. 首先搜集网上的资料,基本大同小异,这里就不多做解释了,代码附上: public class EnumFlagsA ...
- Devexpress Xtrareports 创建多栏报表
根据官方回答:多列或多行(取决于当前的多栏设置)呈现数据的报表 这种报表是有用的,例如,当每个明细区都只显示少量数据.并且需要在一列的右侧打印下一个明细区时,这样就能充分利用整个页面的宽度,此外,当创 ...
- golang中并发的相关知识
golang中done channel理解:https://segmentfault.com/a/1190000006261218 golang并发模型之使用Context:https://segme ...
- Python数据类型及常用操作
Python字符串类型 1.用途: 用来记录有描述性的状态.比如:人名,地址等. 2.定义方式: 创建字符串非常简单,在‘ ’,“ ”,‘’‘ ’‘’内一填写一系列的字符例如:msg='hello' ...
- 移动webApp - 1像素实现(点5像素的秘密)
在移动web项目中,经常会实现以下1像素的边框 移动web设计中,在retina显示屏下网页会由1px会被渲染为2px,那么视觉稿中1px的线条还原成网页需要css定义为0.5px 但是正当我们去用0 ...