本文循序漸進教向大家如何給現(xiàn)有項目中 JavaScript 的代碼「編寫聲明文件」。

1. 描述全局命名空間對象

全局變量 myLib 上有一個函數(shù) makeGreeting 用于創(chuàng)建問候語，以及一個屬性numberOfGreetings，表示到目前為止已經制作的問候語數(shù)量。

代碼案例

聲明方式

• 通過 declare namespace 聲明命名空間

• 在命名空間內部({})聲明函數(shù)類型和變量類型(用分號 ; 隔開)，描述命名空間下可以訪問的函數(shù)或值（通過點運算符(dotted notation)）。

2. 描述全局變量和函數(shù)

全局變量 foo 表示 widgets 展現(xiàn)次數(shù)。

全局函數(shù) greet 可以接受字符串參數(shù)調用，向用戶展示問候信息

代碼案例

聲明方式

• 使用 declare var 聲明全局變量

• 使用 declare function 聲明全局函數(shù)

3. 描述重載函數(shù)

所謂重載函數(shù)（Overloaded Functions），即函數(shù)調用方式不止一種。

getWidget 函數(shù)接受一個數(shù)字并返回一個 Widget，或者接受一個字符串并返回一個Widget 數(shù)組。

代碼案例

聲明方式

因為不是聲明命名空間，而是一個全局函數(shù)，所以使用 declare function 就行。

4. 描述函數(shù)的對象類型參數(shù)

調用 greet 函數(shù)時，您必須傳遞一個 GreetingSettings 對象。該對象具有以下屬性：

1. greeting：必填字符串

2. duration：可選時間長度（以毫秒為單位）

3. color：可選字符串，例如‘＃ff00ff’

代碼案例

聲明方式

• GreetingSettings 是個對象類型，所以要使用 interface 聲明了

• greet 函數(shù)依舊使用 declare function 聲明

5. 描述函數(shù)的聯(lián)合類型參數(shù)

調用 greet 函數(shù)時，您可以提供一個字符串、或返回字符串的函數(shù)、或 Greeter 實例。

代碼案例

聲明方式

• greet 函數(shù)依舊使用 declare function 聲明

• 其參數(shù) GreetingLike 是個聯(lián)合類型

6. 描述類（構造函數(shù)、屬性和方法）

創(chuàng)建 Greeter2 類的實例對象 myGreeter, 支持擴展 Greeter2 類型（比如 SpecialGreeter）的方式創(chuàng)建自定義 greeter 對象。

代碼案例

聲明方式

本題我們會借用 declare class 描述 class 或類 class 對象。有屬性、有方法還有構造函數(shù)。

7. 描述類實例上方法的參數(shù)

greeter 對象可以記錄到文件方法（.log()）或顯示提示方法（.alert()）。 可以向 .log(...) 提供 LogOptions 并向 .alert(...) 提供 AlertOptions

代碼案例

聲明方式

LogOptions 和 AlertOptions 也可以通過 declare namespace 方式聲明的，與在“描述全局命名空間對象”中不同的是，前者只聲明了類型，后者則是聲明了函數(shù)/變量。

參考

• https://www.typescriptlang.org/docs/handbook/declaration-files/by-example.html