javascript模块是什么_如何导入和导出模块【教程】
JavaScript模块需显式声明加载方式，import必须顶层静态解析，命名导出支持多个具名实体，default导出仅一个且可重命名，HTML中须用type="module"启用。
JavaScript 模块就是带 export 声明的脚本文件，或用 export / export default 显式暴露接口的代码单元；它不是靠文件后缀或运行时自动识别的，而是由加载方式（type="module" 或 import 语句）触发模块解析。
为什么 import 写在顶部且不能加条件？
ES 模块是静态解析的：浏览器或 Node.js 在执行前就扫描全部 import 语句，确定依赖图并提前加载。所以 import 必须出现在顶层作用域，不能放在 if、函数或 try 里。
-
import不是普通语句，是语法指令，类似const声明 - 动态导入要用
import()函数（返回 Promise），比如import('./utils.js') - Node.js 中若用
require()加载一个 ES 模块文件，会报ERR_REQUIRE_ESM
export 和 export default 的区别在哪？
命名导出（ export）允许多个导出，导入时必须用大括号匹配原名；默认导出（export de）每个模块只能有一个，导入时可任意起名，不加括号。
/* math.js */
export const PI = 3.14159;
export function add(a, b) { return a + b; }
export default function multiply(a, b) { return a * b; }/* main.js */
import multiply, { PI, add } from './math.js'; // ✅ 正确
import { multiply } from './math.js'; // ❌ multiply 是 default，不能这样解构- 命名导出适合导出工具函数、常量、类等“多个具名实体”
-
export default适合导出模块主功能（如 React 组件、单例类、工厂函数） - 混用时注意：
export default后面不能跟分号，但可以跟表达式或函数声明
浏览器中不加 type="module" 就无法用 import？
是的。HTML 中的 默认是传统脚本模式，即使文件里写了 import，也会直接报 Uncaught SyntaxError: Cannot use import statement outside a module。
- 必须显式声明：
- 模块脚本自动启用严格模式、有独立作用域、支持顶层
await - 路径必须是相对或绝对 URL（不能是纯文件名），例如
./utils.js可行，utils.js会 404 - 开发时若用本地
file://协议，Chrome 会因 CORS 拒绝模块加载——得用本地服务器（如npx serve）
模块机制本身不复杂，但错误往往出在加载链上：一个地方漏了 type="module"，或路径写成 utils.js 而非 ./utils.js，或混合用了 require 和 import —— 这些边界问题比语法本身更常卡住人。
