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 ...
随机推荐
- 效率工具(fswatch,rsync)
mac 安装 brew: ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/in ...
- javascrip学习之基础
弹窗信息:三种消息框:警告框.确认框.提示框. window.alert("sometext"); var r=confirm("按下按钮");//提示信息,返 ...
- Broken Keyboard (a.k.a. Beiju Text) UVA - 11988 (链表)
题目链接:https://vjudge.net/problem/UVA-11988 题目大意:输入一个字符串,输出在原本应该是怎么样的? 具体方法是 碰到' [ ' 回到最前面 碰到‘ ]’ 回 ...
- 软件使用---Eclipse
代码提示快捷操作.这个叫做,内容分析(content assist) 1.设置自动提示: 2.设置快捷键:
- 【C】一个读取文件记录器
分享一下!!! #include<stdio.h> #include<windows.h> #define N 70000 //定义行数!!用空间换取时间 struct stu ...
- (生产)vue-router:路由
参考:https://router.vuejs.org/zh-cn/ 安装 直接下载 / CDN https://unpkg.com/vue-router/dist/vue-router.js 使用: ...
- [bootstrap]模态框总结
<!--data-backdrop禁止点击空白处关闭模态框,也可以js设置,其他参数可参考官网模态框文档--> <div class="modal fade" i ...
- selenium并行的使用
Selenium Grid Parallel Test(C#) Author: Mars (hnynes)Email: hnynes@gmail.comMSN: hnynes@gmail.co ...
- windows10家庭中文版升级专业版或企业版简单方便的操作方法
以管理员的身份运行cmd 1 ,升级到专业版输入:slmgr /ipk W269N-WFGWX-YVC9B-4J6C9-T83GX 输入slmgr.vbs -skms zh.us.to 激活 2, 升 ...
- Linux 下安装使用 oh-my-zsh
Ubuntu 下安装 oh-my-zsh 安装 zsh sudo apt install zsh 安装 git(如果你的系统没有自带的话) sudo apt install git 安装 oh-my- ...