美文网首页
AMD、CMD、CommonJS、ES6 Module

AMD、CMD、CommonJS、ES6 Module

作者: 莣忧草_3b53 | 来源:发表于2020-11-25 15:02 被阅读0次

    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

    相关文章

      网友评论

          本文标题:AMD、CMD、CommonJS、ES6 Module

          本文链接:https://www.haomeiwen.com/subject/fjrniktx.html