命名空间（Namespace）：
1. 定义方式：
使用 namespace 关键字定义命名空间。
// mathOperations.ts
namespace MathOperations {
export function add(a: number, b: number): number {
return a + b;
}
export function subtract(a: number, b: number): number {
return a - b;
}
}
2. 引用方式：
在其他文件中，可以使用 /// <reference path="path/to/file.ts" /> 指令引用命名空间所在的文件。
/// <reference path="mathOperations.ts" />
// app.ts
let sum = MathOperations.add(10, 5);
console.log(sum); // 输出: 15
3. 导出方式：
命名空间的成员需要使用 export 明确导出。
// mathOperations.ts
namespace MathOperations {
export function add(a: number, b: number): number {
return a + b;
}
}
4. 导入方式：
使用 import 关键字导入命名空间中的成员。
// app.ts
import { add } from './mathOperations';
let sum = add(10, 5);
console.log(sum); // 输出: 15
模块（Module）：
1. 定义方式：
使用 module 关键字定义模块。
// mathOperations.ts
module MathOperations {
export function add(a: number, b: number): number {
return a + b;
}
export function subtract(a: number, b: number): number {
return a - b;
}
}
2. 引用方式：
在现代 TypeScript 中，不再需要 /// <reference>，而是使用 ES6 模块导入和导出。
// app.ts
import { add } from './mathOperations';
let sum = add(10, 5);
console.log(sum); // 输出: 15
3. 导出方式：
不再需要使用 export 明确导出，而是通过 export 关键字直接导出。
// mathOperations.ts
export function add(a: number, b: number): number {
return a + b;
}
4. 导入方式：
使用 import 关键字导入模块中的成员。
// app.ts
import { add } from './mathOperations';
let sum = add(10, 5);
console.log(sum); // 输出: 15
区别和建议：
- 命名空间的问题：
命名空间容易导致全局命名冲突，并且在大型应用中可能变得难以维护。
- 模块的优势：
模块提供更好的封装性，避免了全局命名冲突，且符合现代 JavaScript 开发的趋势。推荐在新项目中使用模块而不是命名空间。
- 迁移：
对于已经使用命名空间的项目，可以逐渐迁移到模块系统。可以通过将命名空间中的代码整理为模块，并逐渐将导入和导出语句替换成 ES6 模块语法。
// mathOperations.ts
export namespace MathOperations {
export function add(a: number, b: number): number {
return a + b;
}
export function subtract(a: number, b: number): number {
return a - b;
}
}
// app.ts
import { MathOperations } from './mathOperations';
let sum = MathOperations.add(10, 5);
console.log(sum); // 输出: 15
总体而言，模块是 TypeScript 中更现代、更强大的组织代码的方式，因此在新项目中推荐使用模块。
转载请注明出处：http://www.zyzy.cn/article/detail/4707/TypeScript