模块化机制

一、是什么

模块化是将代码拆分成独立文件,互相导入导出。

二、为什么

解决问题:

  • 全局变量污染
  • 代码耦合严重
  • 难以维护

三、核心机制

1. CommonJS

// 导出
module.exports = { a: 1 };

// 导入
const obj = require('./a');

特点:

  • 同步加载
  • Node.js 使用

2. ES Module

export const a = 1;

import { a } from './a.js';

特点:

  • 静态分析
  • 支持 tree-shaking
  • 浏览器原生支持

3. 区别

特性CommonJSES Module
加载方式同步异步
变量拷贝引用
运行时Node浏览器

四、总结

  • 前端主流:ES Module
  • Node 逐步支持 ESM