模块导出使用
export关键字,将模块内部的变量、函数、类、接口等暴露给其他模块使用。TypeScript 支持多种导出方式。
命名导出可以导出多个成员。
export const PI = 3.14159
export function add(a: number, b: number): number {
return a + b
}
export class Calculator {
multiply(a: number, b: number): number {
return a * b
}
}
export interface User {
id: number
name: string
}
export type ID = string | number
命名导出可以导出变量、函数、类、接口、类型别名等。
可以使用导出列表集中导出。
const PI = 3.14159
function add(a: number, b: number): number {
return a + b
}
class Calculator {
multiply(a: number, b: number): number {
return a * b
}
}
export { PI, add, Calculator }
导出列表让导出更加清晰。
导出时可以重命名。
function add(a: number, b: number): number {
return a + b
}
function subtract(a: number, b: number): number {
return a - b
}
export {
add as sum,
subtract as difference
}
导入时使用重命名后的名称。
每个模块可以有一个默认导出。
export default class User {
constructor(public name: string) {}
}
默认导出导入时可以自定义名称。
import User from "./user"
const user = new User("张三")
默认导出通常用于导出模块的主要功能。
模块可以同时有默认导出和命名导出。
export default class User {
constructor(public name: string) {}
}
export function validateName(name: string): boolean {
return name.length > 0
}
export const MAX_NAME_LENGTH = 50
导入时可以分别导入。
import User, { validateName, MAX_NAME_LENGTH } from "./user"
const user = new User("张三")
console.log(validateName(user.name))
console.log(MAX_NAME_LENGTH)
可以从其他模块重新导出。
export { add, subtract } from "./math"
export { User } from "./user"
export * from "./utils"
重新导出可以组合多个模块的导出。
可以只导出类型。
export type User = {
id: number
name: string
}
export interface Product {
id: number
name: string
price: number
}
TypeScript 3.8 引入了 export type 语法,明确表示只导出类型。
export type { User, Product }
常量导出常用于配置。
export const API_BASE_URL = "https://api.example.com"
export const MAX_RETRIES = 3
export const TIMEOUT = 5000
导入后可以直接使用常量。
import { API_BASE_URL, MAX_RETRIES, TIMEOUT } from "./config"
console.log(API_BASE_URL)
console.log(MAX_RETRIES)
console.log(TIMEOUT)
模块导出在实际开发中常用于组织工具函数。
export function formatDate(date: Date): string {
return date.toLocaleDateString("zh-CN")
}
export function formatCurrency(amount: number): string {
return `¥${amount.toFixed(2)}`
}
export function debounce<T extends (...args: any[]) => any>(
fn: T,
delay: number
): (...args: Parameters<T>) => void {
let timer: ReturnType<typeof setTimeout>
return (...args: Parameters<T>) => {
clearTimeout(timer)
timer = setTimeout(() => fn(...args), delay)
}
}
工具模块导出多个相关函数,便于复用。
模块导出使用 export 关键字,支持命名导出和默认导出。命名导出可以导出多个成员,默认导出每个模块只能有一个。导出时可以重命名,可以从其他模块重新导出。export type 明确表示只导出类型。合理使用模块导出可以组织代码结构,提高代码的可维护性。