AMD、CMD、CommonJS、ES6 Module

2020-11-25  本文已影响0人  莣忧草_3b53

1. AMD(RequireJS)

一开始就下载.所有依赖这个模块的语句,都定义在一个回调函数中,等到加载完成之后,这个回调函数才会运行。

// a.js
define(function(){
    return 1;
})
require(['a'], function(a){
    console.log(a);// 1
});

2. CMD ( SeaJS )

CMD推崇依赖就近,延迟执行。也就是说,只有到require时依赖模块才执行。

define(function(require, exports, module) {
  var $ = require('jquery');

  exports.setColor = function() {
    $('body').css('color','#333');
  };
});

3. CommonJS

就是在node环境用规范。弥补JavaScript在服务器端缺少模块化机制,NodeJS、webpack都是基于该规范来实现的

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

4. ES6 Module

CommonJS加载的是整个模块,将所有的接口全部加载进来,ES6 Module可以单独加载其中的某个接口;
CommonJS输出是值的拷贝,ES6 Module输出的是值的引用,被输出模块的内部的改变会影响引用的改变;
CommonJS this指向当前模块,ES6 Module this指向undefined;

我们平时在webpack中使用的export/import,会经过babel转换为CommonJS规范。

链接:https://juejin.cn/post/6844903998089101319

上一篇下一篇

猜你喜欢

热点阅读