JavaScript模块是封装变量、函数或类的独立代码单元,通过import/export机制交互,避免全局污染;默认严格模式,有独立作用域,仅执行一次;支持命名导出/导入、默认导出/导入、混合导入及整体导入;浏览器需type="module",Node.js需.mjs或"type":"module"。

JavaScript模块是一段可独立运行、封装了变量、函数或类的代码单元,它通过明确的导入(import)和导出(export)机制与其他代码交互,避免全局污染,提升复用性和可维护性。
模块的基本特征
模块默认是严格模式,顶层的 this 是 undefined;每个模块拥有自己的作用域,变量不会自动挂到全局;模块只执行一次,多次导入仍共享同一份实例。
如何导出(export)
导出有命名导出和默认导出两种方式,可混合使用:
-
命名导出:一个模块可导出多个值,需用原名或重命名导入
export const PI = 3.14;export function add(a, b) { return a + b; }export { add as sum }; // 重命名导出 -
默认导出:每个模块最多一个,导入时可自定义名称,无需花括号
export default function greet() { return 'Hello'; }export default class User { ... }
如何导入(import)
导入必须在模块顶层(不能在条件或函数内),常见写法如下:
立即学习“Java免费学习笔记(深入)”;
-
导入命名导出:用大括号,名称需与导出一致(可重命名)
import { PI, add } from './math.js';import { add as sum } from './math.js'; -
导入默认导出:不加花括号,名字任意
import greet from './utils.js';import MyUser from './user.js'; -
同时导入默认 + 命名:默认放前面,命名放花括号里
import greet, { PI, add } from './math.js'; -
整体导入(namespace):把所有导出挂载为对象属性
import * as math from './math.js';console.log(math.PI, math.add(2, 3));
模块加载注意点
浏览器中使用模块需加 type="module":
Node.js 中需将文件后缀设为 .mjs 或在 package.json 中设置 "type": "module"。动态导入可用 import('./module.js') 返回 Promise,适合按需加载。
基本上就这些。模块不是语法糖,而是 JavaScript 官方标准的组织方式,用对了能让项目结构更清晰、协作更顺畅。











