前端模块化简要说明

前端模块化简要说明:

规范名 描述 使用 特点
AMD AMD一开始是CommonJS规范中的一个草案,全称是Asynchronous Module Definition,即异步模块加载机制。后来由该草案的作者以RequireJS实现了AMD规范,所以一般说AMD也是指RequireJS。 这里的使用也就是说的 RequireJs 的 api 的使用,a文件 define 定义了一个方法,可以在 b 文件中通过 require 来引用并指定一个回调函数。​ 依赖的引用文件会前置执行,也就是前面的 a 文件会前置执行。
CMD CMD是SeaJS在推广过程中生产的对模块定义的规范,在Web浏览器端的模块加载器中,SeaJS与RequireJS并称,SeaJS作者为阿里的玉伯。 这里的使用也就是 seaJs 的使用,在文件 a 中 define定义一个 factory 函数可以引用依赖和暴露,在​文件 b 中通过 use 来调用 a 暴露的依赖。 从文件 a 中我们可以很明显的看到 seaJs 的依赖是就近依赖的,就和咱们声明变量一样写在变量使用的上边。这样使用的话,依赖就会在执行的时候才回去加载。但是在实现的本质上和 requireJs 是没有明显的区别的。
CommonJs CommonJS规范为CommonJS小组所提出,目的是弥补JavaScript在服务器端缺少模块化机制,NodeJS、webpack都是基于该规范来实现的。 commonJs 实现的方法说明,​通过 module.exports 或者 exports 来暴露依赖,使用 require 来调用依赖。 1.所有代码都运行在模块作用域,不会污染全局作用域;2.模块是同步加载的,即只有加载完成,才能执行后面的操作;3.模块在首次执行后就会缓存,再次加载只返回缓存结果,如果想要再次执行,可清除缓存;4.require返回的值是被输出的值的拷贝,模块内部的变化也不会影响这个值。
ES6 Module ES6 Module是ES6中规定的模块体系,相比上面提到的规范, ES6 Module有更多的优势,有望成为浏览器和服务器通用的模块解决方案。 es6 实现​export 暴露依赖,import 引用依赖。 1. CommonJS模块是运行时加载,ES6 Module是编译时输出接口;2.CommonJS加载的是整个模块,将所有的接口全部加载进来,ES6 Module可以单独加载其中的某个接口;3.CommonJS输出是值的拷贝,ES6 Module输出的是值的引用,被输出模块的内部的改变会影响引用的改变;4.CommonJS this指向当前模块,ES6 Module this指向undefined;

你可能感兴趣的:(javascript,前端)