網站搜尋

如何在 TypeScript 中建立類似 enum 的類型?


我正在為 TypeScript 的 Google 地圖 API 製作一個定義文件。

我需要定義一種類似 enum 的類型,例如 google.maps.Animation,它包含兩個屬性:BOUNCE 和 DROP。

這應該如何在 TypeScript 中完成?

答案#1

TypeScript 0.9 以上版本有一個列舉型別的規範:

enum AnimationType {
    BOUNCE,
    DROP,
}

最後一個逗號是可選的。

答案#2

從 TypeScript 0.9(目前為測試版)開始,你可以像這樣使用 enum 定義:

enum TShirtSize {
  Small,
  Medium,
  Large
}

var mySize = TShirtSize.Large;

預設情況下,這些列舉值將分別被指派為 0、1 和 2。如果你想明確設定這些數字,可以在列舉宣告時進行設定。

列表 6.2 具有明確成員的列舉

enum TShirtSize {
  Small = 3,
  Medium = 5,
  Large = 8
}

var mySize = TShirtSize.Large;

這兩個例子都直接取自《TypeScript for JavaScript 程式設計師》。

請注意,這與 0.8 規格不同。 0.8 規格的樣子是這樣的——但它被標記為實驗性且可能會更改,所以你需要更新任何舊代碼:

免責聲明 - 這個 0.8 範例在較新的 TypeScript 編譯器版本中將會失效。

enum TShirtSize {
  Small: 3,
  Medium: 5,
  Large: 8
}

var mySize = TShirtSize.Large;

答案#3

這現在已成為語言的一部分。請參見 TypeScriptLang.org > 基本類型 > enum 以獲取相關文檔。以下是關於如何使用這些列舉的文檔節選:

enum Color {Red, Green, Blue};
var c: Color = Color.Green;

或者使用手動備份號碼:

enum Color {Red = 1, Green = 2, Blue = 4};
var c: Color = Color.Green;

你也可以透過例如 Color[2] 回到列舉的名稱。

這是一個展示這一切如何結合在一起的例子:

module myModule {
    export enum Color {Red, Green, Blue};

    export class MyClass {
        myColor: Color;

        constructor() {
            console.log(this.myColor);
            this.myColor = Color.Blue;
            console.log(this.myColor);
            console.log(Color[this.myColor]);
        }
    }
}

var foo = new myModule.MyClass();

這將記錄:

undefined  
2  
Blue

因為,在撰寫此時,Typescript Playground 會生成這段程式碼:

var myModule;
(function (myModule) {
    (function (Color) {
        Color[Color["Red"] = 0] = "Red";
        Color[Color["Green"] = 1] = "Green";
        Color[Color["Blue"] = 2] = "Blue";
    })(myModule.Color || (myModule.Color = {}));
    var Color = myModule.Color;
    ;
    var MyClass = (function () {
        function MyClass() {
            console.log(this.myColor);
            this.myColor = Color.Blue;
            console.log(this.myColor);
            console.log(Color[this.myColor]);
        }
        return MyClass;
    })();
    myModule.MyClass = MyClass;
})(myModule || (myModule = {}));
var foo = new myModule.MyClass();

答案#4

只是另外提醒一下,你可以使用以下方式來建立 id/字串列舉:

class EnumyObjects{
    public static BOUNCE={str:"Bounce",id:1};
    public static DROP={str:"Drop",id:2};
    public static FALL={str:"Fall",id:3};


}

答案#5

更新:

如 @iX3 所指出,Typescript 2.4 支援列舉字串。

參見:在 Typescript 中建立具有字串值的列舉

原始答案:

對於字串成員值,TypeScript 只允許數字作為列舉成員值。但你可以實現一些解決方案/技巧;

方案 1:

複製自: https://blog.rsuter.com/how-to-implement-an-enum-with-string-values-in-typescript/

有一個簡單的解決方法:在賦值前只需將字串字面量轉型為 any:

export enum Language {
    English = <any>"English",
    German = <any>"German",
    French = <any>"French",
    Italian = <any>"Italian"
}

方案二:

複製自: https://basarat.gitbooks.io/typescript/content/docs/types/literal-types.html

你可以使用字串字面值作為一種類型。例如:

let foo: 'Hello';

在這裡,我們創建了一個名為 foo 的變數,它僅允許賦值字面量 'Hello'。如下所示:

let foo: 'Hello';
foo = 'Bar'; // Error: "Bar" is not assignable to type "Hello"

它們單獨使用時不是很有用,但可以在型別聯合中結合,以創建一個強大(且有用)的抽象,例如:

type CardinalDirection =
    "North"
    | "East"
    | "South"
    | "West";

function move(distance: number, direction: CardinalDirection) {
    // ...
}

move(1,"North"); // Okay
move(1,"Nurth"); // Error!