一、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对比的更多相关文章

  1. 深度扫盲JavaScript的模块化(AMD , CMD , CommonJs 和 ES6)

    原文地址 https://blog.csdn.net/haochangdi123/article/details/80408874 一.commonJS 1.内存情况 对于基本数据类型,属于复制.即会 ...

  2. js模块系统 - amd|cmd|commonjs|esm|umd

    写过前端代码大概率听说过amd cmd umd commonjs esm这些名词, 想当初我第一次看到这些的时候, 人都麻了, 都是些啥啊. 后来我知道了, 这些都是js的模块规范. amd - 浏览 ...

  3. AMD/CMD/CommonJs到底是什么?它们有什么区别?

    知识点1:AMD/CMD/CommonJs是JS模块化开发的标准,目前对应的实现是RequireJs/SeaJs/nodeJs.   知识点2:CommonJs主要针对服务端,AMD/CMD主要针对浏 ...

  4. FW: AMD, CMD, CommonJS和UMD

    javascript 我是豆腐不是渣 4月5日发布 推荐 2 推荐 收藏 32 收藏,486 浏览 今天由于项目中引入的echarts的文件太大,requirejs经常加载超时,不得不分开来加载ech ...

  5. AMD, CMD, CommonJS和UMD

    我的Github(https://github.com/tonyzheng1990/tonyzheng1990.github.io/issues),欢迎star 今天由于项目中引入的echarts的文 ...

  6. AMD,CMD.CommonJs和UMD还有es6的模块化对比

    CommonJS CommonJS是服务器端模块的规范,Node.js采用了这个规范. 根据CommonJS规范,一个单独的文件就是一个模块.加载模块使用require方法,该方法读取一个文件并执行, ...

  7. JS模块之AMD, CMD, CommonJS、UMD和ES6模块

    CommonJS 传送门 同步加载,适合服务器开发,node实现了commonJS.module.exports和require 判断commonJS环境的方式是(参考jquery源码): if ( ...

  8. AMD CMD commonJS es6

    看到很多人傻傻的分不清楚 AMD.CMD . commonJS . es6的区别,实际上这跟这几年前段技术的发展有很大的关系. 实际上这是JavaScript的模块化思想演进的一个过程. 最开始的时候 ...

  9. js模块化开发 AMD CMD Commonjs

    在es6全面实行开来之前  js实现模块开发方案有: 1.AMD 异步模块开发定义  依赖前置,requireJs应用了这一规范 require([module], callback); 加载完后回调 ...

  10. AMD、CMD、CommonJs和 ES6对比

    AMD(异步模块定义)是RequireJS在推广过程中对模块定义的规范化产出. define(['package/lib'], function(lib){ function foo(){ lib.l ...

随机推荐

  1. awk, sed, xargs, bash

    http://ryanstutorials.net/   awk: split($1, arr, “\t”)   sed: sed -n '42p' file sed '42d' file sed ' ...

  2. Matrix Chain Multiplication (堆栈)

    题目链接:https://vjudge.net/problem/UVA-442 题目大意:输入n个矩阵的维度和一些矩阵链乘表达式,输出乘法的次数.如果乘法无法进行,输出error. 假定A是m*n的矩 ...

  3. Murano Weekly Meeting 2015.08.04

    Meeting time: 2015.August.4th 1:00~2:00 Chairperson:  Serg Melikyan, PTL from Mirantis Meeting summa ...

  4. jQuery Validate使用说明

    jQuery Validate 导入 js 库 <script src="./jquery-validation/lib/jquery-1.8.3.js" type=&quo ...

  5. Hibernate系列3-----之修改

    只是修改测试类,先看其他的代码的同学,请翻看我的博客Hibernate1,嘿嘿,我就在这不在重写一遍来 @Test public void testhibernate() { updateStuden ...

  6. intellijidea课程 intellijidea神器使用技巧 6-1 Spring的关联

    待学完spring之后再来看 Spring的关联位置:菜单->File->Project Structure->Facets功能:帮助管理Spring容器.还提供了很多其他的管理,比 ...

  7. 背景图片之background的用法

    常用的background背景属性有: background-color 设置颜色作为对象背景颜色background-image 设置图片作为背景图片background-repeat 设置背景平铺 ...

  8. 跨平台图表控件TeeChart使用教程:将图表数据导出为XML格式

    在开发者使用TeeChart进行开发的过程中,不管是在设计时或者运行时都可以使用的图表导出对话框将图表数据轻易地导出为XML格式: TeeChart最新版那下载地址 上图为TeeChart导出对话框的 ...

  9. 再谈 Struts1.x 的运行机制

    1.Action类 execute 方法 ActionMapping 对应 <action path="user" type="myuser.UserAction& ...

  10. Java —类和对象

    类和对象 类是对象的类型,是具有相同的属性和方法的一组对象的集合. 定义类 访问修饰符 class 类名 { 数据类型 属性名: 访问修饰符 返回值类型 方法名 {} } 创建对象:类名 对象名 = ...