AMD,CMD,Common.js和ES6简单对比


AMD是Require.js在推广过程中对模块定义的规范化产出


1.依赖前置

define(["alpha"], function (alpha) {

  return {

  verb: function(){

  return alpha.verb() + 2;

  }

  }; 

  });

CMD是Sea.js在推广过程中对模块定义的规范化产出


1.依赖就近

define(function(require, exports) {

  // 获取模块 a 的接口
  var a = require('./a');

  // 调用模块 a 的方法
  a.doSomething();

});

Common.js规范前端浏览器不支持,通常在服务端node使用此规范

特点:

  • 所有的代码都运行再模块作用域,不会污染全局作用域
  • 模块是同步加载,即只有加载完成才能执行后面的操作
  • 模块在首次执行后就会缓存,再次加载只返回缓存结果,如果想要再次执行,可清除缓存
  • require返回的值是被输出的值的拷贝,模块内部的变化也不会影响这个值

输出:exports.方法

    Node为每个模块提供一个exports变量,指向module.exports

   module.exports  

     module.exports属性表示当前模块对外输出的接口,其他文件加载该模块,实际上就是读取module.exports变量。


ES6 es6相比common.js具有更多优势,有望成为浏览器和服务器通用的模块解决方案

特点

  • Common.js模块是运行时加载,ES6 Module是编译时输出接口;
  • Common.js加载的是整个模块,将所有的接口全部加载进来,ES6可以单独加载其中的某个接口;
  • Common.js输出的是值的拷贝,ES6输出的是值的引用
  • Common.js this指向当前模块,ES6 this指向undefined

目前浏览器对ES6 Module兼容还不太好,我们平时在webpack中使用的export/import,会经过babel转换为CommonJS规范。


export default {}   默认输出

import 输入


原文地址:https://www.cnblogs.com/wangxirui/p/9029426.html