模块

模块模式是管理复杂性的永恒工具。开发者可以通过它将逻辑分块、各自封装、相互独立，并将它们连接在一起。

多年以来，CommonJS和AMD这两个分别针对服务端环境和主要于浏览器环境的的模块系统长期割裂。

但随着ES6的出现重新定义了浏览器模块，集两个系统之长于一身，使得模块定义和导入导出更加简洁和直观。

CommonJS

CommonJS模块规范主要用于服务端的js(如：node.js)。每个文件就是一个模块，使用module.export和require导入导出

定义模块(module.js)

// 私有变量和方法
let privateVar = 'private name'

function privateWay(){
  console.log(privateVar)
}

//导出公共接口
module.exports = {
  publicVar:'public name',
  publicWay:function(){
    privateWay()
  }
}

导入模块

const myModule = require('module.js')

myModule.publicWay() // private name

AMD

AMD模块系统主要用于浏览器环境，特别是需要异步加载模块的场景

定义模块(module.js)

define([], function() {
    let privateVar = "I am private";
 
    function privateMethod() {
        console.log(privateVar);
    }
 
    return {
        publicMethod: function() {
            privateMethod();
        },
        publicVar: "I am public"
    };
});

导入模块

require(['./module.js'], function(myModule) {
    myModule.publicMethod(); // 输出 "I am private"
    console.log(myModule.publicVar); // 输出 "I am public"
});

ES6模块

ES6模块系统，使得模块的定义，导入导出更加简洁。使用export和import导入导出

定义模块(module.js)

// 私有变量（实际上在ES6模块中没有真正的私有变量，但可以通过闭包或命名约定模拟）
let privateVar = "I am private";
 
function privateMethod() {
    console.log(privateVar);
}
 
// 导出公共接口
export function publicMethod() {
    privateMethod();
}
 
export const publicVar = "I am public";

导入模块

import { publicMethod, publicVar } from './module.js';
 
publicMethod(); // 输出 "I am private"
console.log(publicVar); // 输出 "I am public"