时间轴：CommonJS-->AMD-->CMD-->ESModuleCommonJS常用于：服务器端、节点、webpack特点：同步/运行时加载、快速磁盘读取语法：//1.导出：通过模块。exports或exports暴露模块module.exports={attr1,attr2}exports.attr=xx**注意**exports=xxx是不允许的，这样写会失效，因为exports的地址变了，exports是一个referencetomodule.exports指向同一个内存，模块最后导出的是module.exports//2.Reference:require('x')constxx=require('xx')//整个重命名const{attr}=require('xx')//解构某一个exportAMD常用：不常用，CommonJs浏览器端实现特点：异步加载：因为是面向浏览器端的，为了不影响渲染，必须异步加载依赖介词：所有的依赖必须写在初始依赖数组中，速度快，但会浪费资源。无论是否使用语法都会预加载所有依赖：//1.导出：通过define定义模块//如果模块还依赖其他模块，则模块将在数组define中填写第一个参数的路径(['x'],function(x){functionfoo(){returnx.fn()+1}return{foo:foo};});//2.引用require(['a'],function(a){a.foo()});CMD常用：不常用，根据CommonJs和AMD实现，优化加载方式特点：异步加载按需加载/依赖Proximity：使用再引用依赖，方便开发，缺点是速度和performancearepoorSyntax://1.export:通过define定义模块//如果模块还依赖其他模块，只需要在使用的地方引用define(function(){functionfoo(){varx=require('x')返回x.fn()+1}返回n{foo:foo};});//2.引用varx=require('a');a.foo();ES模块常用：目前浏览器端默认标准特性：静态编译：在编译时可以判断依赖关系，以及输入输出变量语法：//1.export：通过export或export输出模块default写法一：声明的同时，exportexportvarm=1;exportfunctionm(){};出口类M{};写法二：exportaninterfaceexport{}，看似导出对象实则不是，本质上是引用集合，最常用的导出法export{attr1,attr2}写法三：defaultexportexportdefaultfn//2。quoteimport{x}from'test.js'//导出模块中对应的值，在模块中导出时一定要知道值的名称import{xasmyx}from'test.js'//Changethenameimportxfrom'test.js'//defaultexport的引用方式**注意**1.同一个文件中只能存在一个exportdefault（一个模块只能有一个default输出）2.exportdefault可以同时在模块中使用并导出//模块test.jsvarinfo={name:'name',age:18}exportdefaultinfoexportvarname='oceanbiscuit'exportvarage=18//quote从'test.js'console.log(person)导入人，{name,ageasmyAge}；//{name:'name',age:18}console.log(name+'='+myAge);//海洋饼干==18
