javascript模块化以es6 import/export为核心，支持命名导出、默认导出及混合导入；具静态性、单例性、实时绑定等特性，与commonjs的值拷贝和动态加载有本质区别。
JavaScript 的模块化开发主要通过 ES6 的 import 和 export 语法实现，它原生支持静态分析、编译时检查和树摇优化，是现代前端开发的标准方式。
ES6 模块的基本导出方式
一个模块文件（如 math.js）可以使用多种方式导出变量、函数或类：
- 命名导出（named export）：可导出多个，必须用原名导入，支持重命名
export const PI = 3.14159;
export function add(a, b) { return a + b; }
export class Calculator { /* ... */ }- 默认导出（default export）：每个模块最多一个，导入时可自定义名称，更灵活
export default function debounce(fn, delay) { /* ... */ }ES6 模块的对应导入方式
导入需与导出方式匹配，且路径必须是字符串字面量（不能拼接）：
企业黄页模块 for PHPCMS9 GBK 正式版
下载
PHPCMS V9采用OOP（面向对象）方式进行基础运行框架搭建。模块化开发方式做为功能开发形式。框架易于功能扩展，代码维护，优秀的二次开发能力，可满足所有网站的应用需求。 PHPCMS V9企业黄页主要特色1、模型自定义，支持模型添加、修改、删除、导出、导入功能；2、模型字段自定义，支持模型字段添加、修改、删除、禁用操作；3、分类无限添加，支持批量多级添加；4、新增附件字段功能，实现相同模型，不
- 导入命名导出：用大括号
{}，可重命名（as）
import { PI, add } from './math.js';
import { add as sum } from './math.js'; // 重命名- 导入默认导出：不用大括号，可任意命名
import debounce from './utils.js'; import myDebounce from './utils.js'; // 名字随意
- 混合导入：同时引入默认和命名导出
import debounce, { PI, add } from './math.js'; // 默认在前，命名在后- 整体导入（namespace import）：把所有命名导出挂载为对象属性
import * as math from './math.js'; console.log(math.PI, math.add(2, 3));
常见注意事项和限制
ES6 模块是静态的、顶层的、单例的，这些特性决定了它的行为边界：
立即学习“Java免费学习笔记（深入）”；
- 导入/导出语句只能出现在模块顶层，不能在条件、函数或循环中
- 模块路径必须是相对（
./或../）或绝对（以/开头）URL，不支持动态字符串 - 模块脚本需通过
<script type="module"></script>加载，否则会报错 - 浏览器中模块默认启用严格模式，且有独立作用域（不污染全局）
- 重复导入同一模块不会重复执行，模块代码只执行一次（单例）
与 CommonJS 的关键区别
ES6 模块不是对象，而是绑定关系（live binding）：
- 导出的是绑定，不是值的拷贝。如果导出的变量后续被修改，导入方能感知到更新
- CommonJS（
module.exports/require）导出的是值的快照，修改原始变量不影响已导入值 - ES6 模块支持循环依赖，但需注意初始化时机；CommonJS 在循环依赖中返回已执行部分的对象
