说一下ES6的模块化?以及和AMD、CMD的区别?

es6的模块化

es6的模块化是浏览器端和服务器端通用的模块开发规范,其设计思想就是尽量的静态化,在编译时就确定模块的依赖关系,以及输入输出的变量

其模块化规范中定义:

每个js文件都是一个独立的模块

导入其他成员用import关键字

向外共享成员变量用export关键字

 

AMD

异步加载模块,主要用于浏览器,其定义需要使用requireJs

  • AMD具有以下几个特性:

    1. 采用异步方式加载模块,模块的加载不影响它后面语句的运行.
    2. 所有依赖这个模块的语句,都定义在一个回调函数中,等到加载完成之后,这个回调函数才会运行.
    3. 推崇依赖前置,在定义模块的时候就要声明其依赖的模块
  • AMD的使用
    使用require.js来实现AMD规范的模块化:用require.config()指定引用路径。用define()来定义模块用require来加载模块。

define('moduleName',['a','b'],function(ma, mb) {
  return someExportValue;
})

require(['a', 'b'], function(ma, mb) {
   //    do something
})

CMD

通用模块定义,就近依赖,延迟执行,其定义使用用SeaJs

  • CMD具有以下几个特性:

    1.采用异步方式加载模块,模块的加载不影响它后面语句的运行.
    2.推崇就近依赖,只有在用到某个模块的时候再去require

  • CMD的使用
    使用define来定义define(id?, deps?, factory)
    factory是一个函数,有三个参数,function(require, exports, module)
    require 是一个方法,接受 模块标识 作为唯一参数,用来获取其他模块提供的接口:require(id)
    exports 是一个对象,用来向外提供模块接口
    module 是一个对象,上面存储了与当前模块相关联的一些属性和方法

复制代码
 // 定义模块  module.js
define(function(require, exports, module) {
  var $ = require('jquery.min.js')
  $('div').addClass('active');
});

// 加载模块
seajs.use(['module.js'], function(my){
});
复制代码

 

 

posted @   天青色等烟雨灬  阅读(173)  评论(0编辑  收藏  举报
(评论功能已被禁用)
相关博文:
阅读排行:
· 阿里最新开源QwQ-32B,效果媲美deepseek-r1满血版,部署成本又又又降低了!
· 开源Multi-agent AI智能体框架aevatar.ai,欢迎大家贡献代码
· Manus重磅发布:全球首款通用AI代理技术深度解析与实战指南
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· AI技术革命,工作效率10个最佳AI工具
点击右上角即可分享
微信分享提示