在 TypeScript 中，export 用于将模块中的变量、函数、类、类型等暴露给外部使用。export 语法允许将模块化的代码分割并在其他文件中导入。
1. 命名导出（Named Export）
命名导出是 TypeScript 中最常见的一种导出方式，它允许你导出多个实体，导入时需要使用相同的名字。
语法
export { , , ... };
或者直接在声明时进行导出：
export ;
示例
// math.ts
export const PI = 3.14159;
export function add(x: number, y: number): number {
return x + y;
}
export class Calculator {
static multiply(x: number, y: number): number {
return x * y;
}
}
然后在其他文件中导入：
// app.ts
import { PI, add, Calculator } from './math';
console.log(PI); // 3.14159
console.log(add(2, 3)); // 5
console.log(Calculator.multiply(2, 3)); // 6
部分导入
你也可以选择只导入你需要的部分：
// app.ts
import { add } from './math';
console.log(add(5, 3)); // 8
别名导入
你可以为导入的命名实体指定别名：
// app.ts
import { add as sum, Calculator as Calc } from './math';
console.log(sum(2, 3)); // 5
console.log(Calc.multiply(2, 3)); // 6
2. 默认导出（Default Export）
默认导出用于导出模块中的单个实体，每个模块只能有一个默认导出。在导入时不需要使用花括号，可以自定义导入名称。
语法
export default ;
示例
// greet.ts
export default function greet(name: string): string {
return `Hello, ${name}!`;
}
然后在其他文件中导入并使用：
// app.ts
import greet from './greet';
console.log(greet("Alice")); // Hello, Alice!
3. 混合使用命名导出与默认导出
你可以在一个模块中同时使用命名导出和默认导出：
// utils.ts
export function add(x: number, y: number): number {
return x + y;
}
export function subtract(x: number, y: number): number {
return x - y;
}
export default function multiply(x: number, y: number): number {
return x * y;
}
然后可以这样导入：
// app.ts
import multiply, { add, subtract } from './utils';
console.log(multiply(2, 3)); // 6
console.log(add(2, 3)); // 5
console.log(subtract(5, 3)); // 2
4. 重命名导出（Export Aliases）
你可以在导入时或导出时使用别名。
导出时重命名
// math.ts
const PI = 3.14159;
function add(x: number, y: number): number {
return x + y;
}
// 使用 `as` 来重命名导出的符号
export { PI as PiValue, add as addNumbers };
导入时重命名
// app.ts
import { PiValue, addNumbers } from './math';
console.log(PiValue); // 3.14159
console.log(addNumbers(5, 3)); // 8
5. 导出整个模块（Re-export）
你可以将另一个模块的所有内容导出到当前模块中。这对于模块的组合和封装非常有用。
示例
// math.ts
export const PI = 3.14159;
export function add(x: number, y: number): number {
return x + y;
}
// geometry.ts
export * from './math'; // 将math模块的所有导出都重新导出
// app.ts
import { PI, add } from './geometry';
console.log(PI); // 3.14159
console.log(add(2, 3)); // 5
6. 导出类型（Type Export）
除了导出变量、函数和类，TypeScript 还允许导出类型别名、接口等类型定义。
示例
// types.ts
export interface Person {
name: string;
age: number;
}
export type Point = { x: number; y: number };
// app.ts
import { Person, Point } from './types';
const john: Person = { name: "John", age: 30 };
const point: Point = { x: 10, y: 20 };
7. export = 和 import = require() 的用法
export = 和 import = require() 语法主要用于与旧版 JavaScript 模块（如 CommonJS）兼容。当你希望以 CommonJS 风格导出模块时，可以使用 export =。
示例
// logger.ts
class Logger {
log(message: string) {
console.log(message);
}
}
export = Logger;
// app.ts
import Logger = require('./logger');
const logger = new Logger();
logger.log('Hello, World!');
这种用法较少见，因为大多数 TypeScript 代码会使用 export 和 import 语法。
总结
-
export用于将模块中的代码暴露出去，可以导出函数、类、常量、类型等。 -
export default用于导出模块中的单个实体，导入时不需要花括号，并且可以自定义导入名称。 - 命名导出与默认导出 可以结合使用，一个模块可以有多个命名导出和一个默认导出。
-
export =用于与 CommonJS 等旧版模块系统兼容。
export 和 import 使得 TypeScript 支持模块化，帮助你组织和分离代码，提高代码的可维护性和复用性。
到此这篇关于TypeScript的export用法的文章就介绍到这了,更多相关TypeScript export用法内容请搜索IT俱乐部以前的文章或继续浏览下面的相关文章希望大家以后多多支持IT俱乐部！
