13518219792
这期内容当中小编将会给大家带来有关ECMAScript模块化和CommonJS模块化的区别，以专业的角度为大家分析和叙述，阅读完这篇文章希望大家可以有所收获。
创新互联专注于科尔沁左翼网站建设服务及定制，我们拥有丰富的企业做网站经验。 热诚为您提供科尔沁左翼营销型网站建设，科尔沁左翼网站制作、科尔沁左翼网页设计、科尔沁左翼网站官网定制、微信小程序定制开发服务，打造科尔沁左翼网络公司原创品牌,更为您提供科尔沁左翼网站排名全网营销落地服务。
CommonJS 模块化
采用CommonJS模块规范的应用，每个文件就是一个模块，具有自己的私有作用域，不会污染全局作用域。模块的加载是同步的而且可以加载多次，但在第一次加载后就会被缓存，后面再次被加载时会直接从缓存中读取。CommonJS主要用于服务器Node.js编程。
一、 require 与 module.exports
require 在 ES6（bable将import转化为require） 和 CommonJS 中都支持
// 导出 a.js
let obj = {
name: 'hello',
getName: function (){
return this.name
}
module.exports = obj
// 引入 b.js
let obj = require('./a.js')ES6 模块化
在ES6中每一个模块即是一个文件，在文件中定义的变量，函数，对象在外部是无法获取的。如果你希望外部可以读取模块当中的内容，就必须使用export来对其进行暴露（输出）。
ES6模块化具有以下特点：
使用依赖 预声明的方式导入模块
依赖延迟声明 （CommonJS CMD）
优点：某些时候可以提高效率
缺点： 无法在一开始确定模块依赖关系
依赖预声明：（AMD，ES6）
优点：一开始可以确定模块依赖关系
缺点：某些时候效率低
灵活的多种导入导出方式
闺房的路径表示法： 所有路径必须以 ./ 或 ../ 开头
import命令用于输入其他模块提供的功能;export命令用于规定模块的对外接口。
一、 import 与 export
// 导出 a.js
/** 写法一 **/
var name = 'sheep'
function getSheep() {
name = 'hourse'
}
export {getSheep}
// 引入 b.js
import {getSheep} from '.／a.js'
/** 写法二 **/
var name = 'sheep'
export function getSheep() {
name = 'hourse'
}
// 引入 b.js
import {getSheep} from '.／a.js'二、 import 与 export defalut
export 可以有多个，export default 仅有一个
// 导出 a.js
let obj = {
name: 'hello',
getName: function (){
return this.name
}
export default obj
// 引入 b.js
import obj from './a.js'总结
即使我们使用了 ES6 的模块系统，如果借助 Babel 的转换，ES6 的模块系统最终还是会转换成 CommonJS 的规范。
Babel5 中使用 require 时，引入值是 module.export 返回的值或者是 export default 返回的值。
Babel6中，使用 import 引入时，可以直接获取到 export default 的值 ； 但是如果是 require 导入的组件， 无论导出是 module.export 、export 、 export default可以直接获取到 export default 的值都必须要加上一个 default。
上述就是小编为大家分享的ECMAScript模块化和CommonJS模块化的区别，如果您也有类似的疑惑，不妨参照上述方法进行尝试。如果想了解更多相关内容，请关注创新互联行业资讯。
