TypeScript 命名空间、模块、声明文件

TypeScript 简易教程
一、TypeScript前导
二、TypeScript基础语法
三、TypeScript变量
四、TypeScript Number+String类型
五、TypeScript运算符
六、TypeScript语句
七、TypeScript函数
八、TypeScript 容器类型
九、TypeScript 接口、类、对象
十、TypeScript 命名空间、模块、声明文件
十一、Promise：JavaScript 异步编程的基石
十二、TypeScript：Async Functions

一、 namespace 命名空间

1. 定义

TypeScript 中命名空间使用 namespace 来定义：

namespace SomeNameSpaceName { 
   export interface ISomeInterfaceName {      }  
   export class SomeClassName {      }  
}

2. export

如果需要在外部可以调用 SomeNameSpaceName 中的类和接口，则需要在类和接口添加 export 关键字。

示例：

namespace MyNamespace {
  export function myFunction() {
    // ...
  }
}

export = MyNamespace;

如果一个命名空间在一个单独的 TypeScript 文件中，则应使用三斜杠 /// 引用它:

/// <reference path = "SomeFileName.ts" />

IShape.ts文件代码

namespace Drawing { 
    export interface IShape { 
        draw(); 
    }
}

Circle.ts 文件代码：

/// <reference path = "IShape.ts" /> 
namespace Drawing { 
    export class Circle implements IShape { 
        public draw() { 
            console.log("Circle is drawn"); 
        }  
    }
}

3. 嵌套命名空间

namespace namespace_name1 { 
    export namespace namespace_name2 {
        export class class_name {    } 
    } 
}

二、模块

• 模块是在其自身的作用域里执行，并不是在全局作用域。
• 定义在模块里面的变量、函数和类等在模块外部是不可见的，除非明确地使用 export 导出它们。
• TypeScript 中，每个文件被视为一个模块，并且模块的成员默认是私有的，除非你明确地使用 export 关键字将它们导出。
• 访问这些导出的成员，必须通过 import 导入其他模块导出的变量、函数、类等。

1. 基本用法

模块导出使用关键字 export 关键字。

导出成员

// myModule.ts
export class MyClass {
  sayHello() {
    return "Hello from MyClass";
  }
}

export function myFunction() {
  return "Hello from myFunction";
}

export const myConst = "Hello from myConst";

导入成员

// app.ts
import { MyClass, myFunction, myConst } from './myModule';

const myObject = new MyClass();
console.log(myObject.sayHello()); // "Hello from MyClass"

console.log(myFunction()); // "Hello from myFunction"
console.log(myConst); // "Hello from myConst"

2. 默认导出

默认导出允许从一个模块中导出一个单一的实体。默认导出的成员在导入时不需要使用大括号。

// myModule.ts
export default class DefaultExportedClass {
  // ...
}

// 或者是一个函数、值等
export default function defaultExportedFunction() {
  // ...
}

在导入默认导出的成员时，可以给它们指定任何名称：

// app.ts
import DefaultExportedClass from './myModule';

const myObject = new DefaultExportedClass();

3. 重命名导出和导入

在导出和导入时，可以使用 as 关键字来重命名成员。

// myModule.ts
export const myConst = "Hello";

// app.ts
import { myConst as constantGreeting } from './myModule';

console.log(constantGreeting); // "Hello"

4. 模块解析

TypeScript 支持几种模块解析策略，包括：

• Node 模块解析：这是 Node.js 使用的解析策略，它会尝试在 node_modules 目录下查找模块。
• Classic：这是 TypeScript 的经典模块解析策略，它会尝试在当前目录下查找模块。
• AMD 或 UMD：这些是异步模块定义和通用模块定义的解析策略，通常用于浏览器环境。

以通过 tsconfig.json 文件中的 moduleResolution 选项来配置模块解析策略。

5. 模块路径

模块路径可以是相对路径或绝对路径，也可以是模块名称，如果模块名称没有扩展名或目录信息，TypeScript 会尝试添加 .ts, .tsx, .d.ts 等扩展名。

6. 注意

一个模块文件只能有一个默认导出。
模块成员默认是私有的，只有通过 export 才能在外部访问。
模块成员的导出和导入可以跨越多个文件，有助于代码的组织和重构。

三、声明文件

TypeScript 声明文件（通常命名为 .d.ts）是一种特殊的文件，用于为 TypeScript 提供类型信息，但不包含任何 JavaScript 执行代码。声明文件主要用于定义 TypeScript 编译器无法从 JavaScript 代码中推断出的类型信息，例如第三方 JavaScript 库、全局变量、或者一些特定的 JavaScript 语言特性。

• 声明文件不应该包含任何执行代码，它们只包含类型信息。
• 声明文件不应该导出任何值，它们只能导出类型。
• 声明文件通常放置在项目根目录下，或者一个特定的类型定义目录下。

1. 为什么需要声明文件？

• 第三方库：
  许多第三方 JavaScript 库并没有提供 TypeScript 定义文件。为了在 TypeScript 中使用这些库，需要为它们创建声明文件，以确保类型正确性。
• 全局变量：
  如果的代码依赖于全局变量或者全局函数，声明文件允许定义这些全局成员的类型。
• 模块：
  如果正在编写模块化的代码，可以为模块创建声明文件，以确保模块的接口被正确地使用。
• JavaScript 语言特性：
• 有时候，可能需要定义一些 TypeScript 编译器无法自动推断的 JavaScript 语言特性，如 arguments 对象。

2. 创建声明文件

// myLibrary.d.ts
declare var myGlobalVar: string;

declare function myGlobalFunction(arg: any): void;

declare module 'myModule' {
  export function doSomething(): void;
}

在这个例子中，声明了一个全局变量 myGlobalVar，一个全局函数 myGlobalFunction，以及一个模块 myModule，它导出了一个函数 doSomething。

3. 使用第三方声明文件

许多流行的 JavaScript 库已经有人为其编写了 TypeScript 声明文件，并且可以通过 @types 命名空间在 npm 上找到。可以通过以下命令安装这些声明文件，这将安装 Node.js 的 TypeScript 声明文件。

npm install --save-dev @types/node

4. 声明合并

通过声明合并来组合多个声明文件。这在处理具有多个模块的大型项目时非常有用。

// file1.d.ts
declare module 'myLib' {
  export function funcA(): void;
}

// file2.d.ts
declare module 'myLib' {
  export function funcB(): void;
}

// TypeScript 将这两个声明视为一个模块，该模块导出了 funcA 和 funcB。