0Pricing
TypeScript Academy · 课时

ES 模块（命名导出与默认导出）及重新导出

理解命名导出/导入与默认导出/导入，并学习如何通过重新导出构建清晰的模块边界。

ES 模块（命名导出与默认导出）及重新导出 是 CoddyKit 上的免费 TypeScript Academy 课时。 这是第 1 节课，共 3 节。 你可以在下方免费阅读本课时的完整内容 — 然后在浏览器中使用内置代码编辑器和全天候 AI 导师进行实践。 这是 TypeScript Academy 学习路径的一部分，你的进度在网页和 CoddyKit 应用中同步。 TypeScript Academy 课程共包含 3 节课。

简介

目标：熟练使用 ES 模块。您将导出和导入命名与默认符号，然后通过重新导出组合它们，以构建整洁的公共接口。

命名导出与导入

命名导出会在声明前使用 export；导入时使用大括号：import { name }。

// file: math.ts
export function add(a: number, b: number): number { return a + b }
export const PI = 3.14159

// file: app.ts
import { add, PI } from "./math"
console.log(add(2, 3), PI) // 5 3.14159

默认导出与导入

默认导出是模块的主要值。导入时不使用大括号：import Foo from "./mod"。

// file: greet.ts
export default function greet(name: string) { console.log(`Hello, ${name}`) }

// file: app.ts
import greet from "./greet"
greet("Ada")

默认导出与命名导出结合使用

您可以在一个模块中将一个默认导出与多个命名导出结合起来，并同时导入它们。

// file: color.ts
export default "black"
export const palette = [ "red", "green", "blue" ]

// file: app.ts
import baseColor, { palette } from "./color"
console.log(baseColor, palette.length)

重新导出（汇总模块）

重新导出（export { x } from / export * from）会创建一个汇总模块，这样使用者就能从单一入口导入内容。

// file: math/add.ts
export const add = (a: number, b: number) => a + b

// file: math/index.ts (barrel)
export { add } from "./add"
export * from "./more"

// file: app.ts
import { add } from "./math"
console.log(add(1, 2))

提示与常见问题

提示：

  • 优先使用命名导出，以便查找并保持重命名的一致性。
  • 当模块只有一个“主要”内容时，使用默认导出。
  • 在包的边界处建立汇总模块；避免循环导入。

默认导入检查

快速检查：哪种导入方式与默认导出匹配？

回顾

回顾：多个导出使用命名导出，单个主要值使用默认导出，并使用重新导出提供简洁的入口。

常见问题解答

「ES 模块（命名导出与默认导出）及重新导出」课时是免费的吗？

是的 — 「ES 模块（命名导出与默认导出）及重新导出」的完整文本可在网页上免费阅读。要进行交互式练习（内置代码编辑器和全天候 AI 导师）并解锁 TypeScript Academy 课程的其余内容，请升级到 CoddyKit PRO。 TypeScript Academy 课程共包含 3 节课。

「ES 模块（命名导出与默认导出）及重新导出」这节课中我会学到什么？

理解命名导出/导入与默认导出/导入，并学习如何通过重新导出构建清晰的模块边界。 你通过在浏览器中直接运行的动手代码来练习 TypeScript Academy，全天候 AI 导师会在你学习这节课的过程中回答你的问题。

学习 TypeScript Academy 需要有经验吗？

无需任何先前经验。CoddyKit 上的 TypeScript Academy 课程适合初学者到高级学习者，你可以从这里开始或从头开始，按照自己的节奏学习。 这是第 1 节课，共 3 节。

「ES 模块（命名导出与默认导出）及重新导出」课时需要多长时间？

大多数 CoddyKit 课程大约需要 5–10 分钟。每节课都很精短且互动，所以你能稳步进步，并在网页和应用中从离开的地方继续。

我能在这节 TypeScript Academy 课中编写并运行代码吗？

能。每节 TypeScript Academy 课都包含内置代码编辑器，你可以在浏览器中直接编写并运行真实代码，并获得即时 AI 反馈 — 无需本地设置。

此课程中的所有课时

  1. ES 模块（命名导出与默认导出）及重新导出
  2. 环境声明（.d.ts）与第三方类型定义
  3. 路径映射与模块解析
← 返回 TypeScript Academy