TypeScript enumeration guide

Enumerations are data types supported by TypeScript. Enumerations allow you to define a set of named constants. Use them to more easily record intent or create a set of different cases. Enumerations are mostly used in object-oriented programming languages (such as Java and C#) and can now also be used in TypeScript. They are one of the few features of TypeScript, it is not a type-level extension of JavaScript. Next, I will demonstrate the basic knowledge and use cases of TypeScript enumeration, various enumeration types and the subsequent steps of learning.

What is an enum in TypeScript

Many programming languages (such as C, C#, and Java) have an enum data type, but JavaScript does not. But TypeScript can. TypeScript has number-based and string-based enumerations. TypeScript enumerations allow developers to define a set of named constants. Use them to more easily record intent or create a set of different cases.

The syntax of the enumeration is as follows:

enum States {
    Apple,
    Orange，
    Banana，
    Watermelon
}
// 使用
var fruit = States.Watermelon;

What to pay attention to when using enums in TypeScript

First of all, the value in the enumeration is constant, that is, the enumeration is type-safe, and a compilation error will be returned when the value is reassigned. Secondly, the enumeration should be limited, which helps users create a custom constant system. Enumeration is an object after being compiled: it creates memory-efficient custom constants in JavaScript, and is flexible and easy to express and record intent as a judgment use case.

enum requestStatus {
    success = 200
    error = 400
}

let requestStatus;
(function (requestStatus) {
    requestStatus[requestStatus["success"] = 200] = "success"
    requestStatus[requestStatus["error"] = 400] = "error"
})(requestStatus || (requestStatus = {}));

// requestStatus:
// { '200': 'success', '400': 'error', error: 400, success: 200 }

Types of common enumerations

Numerical enumeration and String enumeration are the most commonly used enumeration types in TypeScript. Below I will use examples to introduce you to their characteristics and how to use them.

** Number enumeration

The numeric enumeration stores the numeric value as a string. Let us define them using the enum keyword. Below I will use an example of storing a set of different types of cars to show the number enumeration in TypeScript:

enum CarType {
    Honda,
    Toyota,
    Subaru,
    Hyundai
}

The enumeration value CarType has four values: Honda, Toyota, Subaru and Hyundai. The enumeration value starts from 0, and the value of each member is incremented by 1, as shown below:

Honda = 0

Toyota = 1

Subaru = 2

Hyundai = 3

If necessary, you can initialize the first value yourself, as shown below:

enum CarType {
    Honda = 1,
    Toyota,
    Subaru,
    Hyundai
}

In the example above, Honda initialized the first member with a value of 1. The remaining number will increase by one.

You might be thinking, if I change the last value, will the previous value decrease according to the last defined value? Let's try:

enum CarType {
    Honda,
    Toyota,
    Subaru,
    Hyundai = 100
}

Unfortunately, this does not work. The value of the current example is:

enum CarType {
    Honda,  // 1
    Toyota, // 2
    Subaru, // 3
    Hyundai // 100
}

Note: It is not necessary to assign sequential values to enumeration members. You can assign any desired value to it

string enumeration

String enumeration is similar to number enumeration, but their enumeration value is initialized with string value instead of digital value. string enumeration has better readability , making it easier to debug programs.

The following example uses the same information as the numeric enumeration example, but expressed as a string enumeration:

enum CarType {
    Honda = "HONDA",
    Toyota = "TOYOTA",
    Subaru = "SUBARU",
    Hyundai = "HYUNDAI"
}

// 访问字符串枚举
CarType.Toyota; //return TOYOTA

Note: The string enumeration value needs to be initialized separately.

Enumeration reverse mapping

An enumeration can use its corresponding enumeration member value to retrieve the num value. Using reverse mapping, you can access the member value and the name of the member value, please see the following example:

enum CarType {
    Honda = 1,
    Toyota,
    Subaru,
    Hyundai
}
CarType.Subaru; //return 3
CarType.["Subaru"]; //return 3
CarType[3]; //return Subaru

CarType[3] returns its member name "Subaru" due to reverse mapping. Let's look at another example:

enum CarType {
    Honda = 1,
    Toyota,
    Subaru,
    Hyundai
}
console.log(CarType)

You will see the following output in the browser console:

{ 
    '1'：'Honda'，
    '2'：'Toyota'，
    '3'：'Subaru'，
    '4'：'Hyundai'，
    Honda：1，
    Toyota：2，
    Subaru：3，
    Hyundai：4 
}

Each value of the enumeration appears twice in the internally stored enumeration object.

Calculate enumeration

The value of an enumeration member can be a constant value or a calculated value. Consider the following example:

enum CarType {
    Honda = 1,
    Toyota = getCarTypeCode('toyota'),
    Subaru = Toyota * 3,
    Hyundai = 10
}

function getCarTypeCode(carName: string): number {
    if (carName === 'toyota') {
        return 5;
    }
}

CarType.Toyota; // returns 5
CarType.Subaru; // returns 15

If the enumeration contains both calculated members and constant members, the uninitialized enumeration members will appear first, or possibly after other initialized members with numeric constants. The next example will show the error:

enum CarType {
    Toyota = getCarTypeCode('toyota'),
    Honda, // Error: Enum member must have initializer
    Subaru,
    Hyundai = Toyota * 3,
}

You can declare the above enumeration like this:

enum CarType {
    Honda,
    Hyundai,
    Toyota = getCarTypeCode('toyota'),
    Subaru = Toyota * 3

The above is the whole content of this article. Through explaining what is enumeration, what should we pay attention to when using enumeration. To our commonly used enumeration types (numerical enumeration, string enumeration), enumeration reverse mapping, calculation enumeration. I believe you already have a certain understanding of enumeration. If there is anything wrong in the article, please correct me, thank you very much.

Recommended reading

The Art of

code signing certificate, let the software really have a name!