TypeScript 初识 - 枚举

molyzzx 发布于2019-08-26 10:46 / 1380人阅读

摘要：当满足以下条件时，枚举成员被当作是常数不具有初始化函数并且之前的枚举成员是常数。在这种情况下，当前枚举成员的值为上一个枚举成员的值加。但第一个枚举元素是个例外。枚举成员使用常数枚举表达式初始化。

数字类型枚举

常规枚举的值都是数字类型，因此被称为数字类型枚举：

enum Color {
    Red,
    Blue,
    Green
}
console.log(Color.Red);
// 0
console.log(Color[0]);
// Red
console.log(Color[Color.Red]);
// Red, Color.Red = 0

改变与数字枚举关联的数字

默认情况下，第一个枚举值是 0，后续的值会递增。

可以通过赋值的方法修改枚举关联的数字，后续的值会递增，但不会修改之前的值：

enum Color {
    Red, // 0
    Blue = 2, // 2
    Green // 3
}

手动赋值后，出现前面的值被后面的值覆盖了，但是 TypeScript 不会进行报错：

enum Color {
    Red = 1, // 1
    Blue = 0, // 0
    Green // 1
}
console.log(Color["Red"] === 1); // true
console.log(Color["Green"] === 1); // true
console.log(Color[1] === "Red"); // false
console.log(Color[1] === "Green"); // true

字符串枚举

枚举的值还可以设置为字符串，当其中一个值赋值为字符串后，后续的值必须要赋值：

enum Color {
    Red, // 0
    Blue = "Blue", // Blue
    Green = "Green" // Green
}

常量枚举

常量枚举可以提升些许的性能，在枚举值不会变化的情况下，最好都使用 const 进行声明：

const enum Color {
    Red,
    Blue,
    Green
}
const red = Color.Red;
// 编译成 const red = 0 /* Red */;

常量枚举与普通枚举的区别是，它会在编译阶段被删除，并且不能包含计算成员。

const enum Color {
    Red,
    Blue,
    Green
}
const red = Color.Red;
// 编译成
// var Color;
// (function (Color) {
//     Color[Color["Red"] = 0] = "Red";
//     Color[Color["Blue"] = 1] = "Blue";
//     Color[Color["Green"] = 2] = "Green";
// })(Color || (Color = {}));
// const red = Color.Red;

计算所得项

枚举项有两种类型：常数项（constant member）和计算所得项（computed member）。

前面的例子使用的都是常数项，计算所得项其实就是通过计算才会得到最后的项：

enum Color {
    Red,
    Green,
    Blue = "blue".length
}

计算所得项后面的值都需要进行手动赋值，否则会因为无法获得初始值而报错。

当满足以下条件时，枚举成员被当作是常数：

不具有初始化函数并且之前的枚举成员是常数。在这种情况下，当前枚举成员的值为上一个枚举成员的值加 1。但第一个枚举元素是个例外。如果它没有初始化方法，那么它的初始值为 0。

枚举成员使用常数枚举表达式初始化。常数枚举表达式是 TypeScript 表达式的子集，它可以在编译阶段求值。当一个表达式满足下面条件之一时，它就是一个常数枚举表达式：

数字字面量

引用之前定义的常数枚举成员（可以是在不同的枚举类型中定义的）如果这个成员是在同一个枚举类型中定义的，可以使用非限定名来引用
带括号的常数枚举表达式

+, -, ~ 一元运算符应用于常数枚举表达式

+, -, *, /, %, <<, >>, >>>, &, |, ^ 二元运算符，常数枚举表达式做为其一个操作对象。若常数枚举表达式求值后为 NaN 或 Infinity，则会在编译阶段报错

所有其它情况的枚举成员被当作是需要计算得出的值。

外部枚举

外部枚举是使用 declare enum 定义的枚举类型：

declare enum Directions {
    Up,
    Down,
    Left,
    Right
}
const directions = [
    Directions.Up,
    Directions.Down,
    Directions.Left,
    Directions.Right
];

// 编译结果
const directions = [
    Directions.Up,
    Directions.Down,
    Directions.Left,
    Directions.Right
];

declare 定义的类型只会用于编译时的检查，编译结果中会被删除。

外部枚举和声明语句一样，常出现在声明文件中。同时使用 declare 和 const 是可以的：

declare const enum Directions {
    Up,
    Down,
    Left,
    Right
}

let directions = [
    Directions.Up,
    Directions.Down,
    Directions.Left,
    Directions.Right
];

// 编译结果
let directions = [0 /* Up */, 1 /* Down */, 2 /* Left */, 3 /* Right */];

GPU云服务器云服务器 docker初识 TypeScript 初识关系数据库 typescript javascript

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/106755.html

TypeScript 初识 - 变量

摘要：通常会定义为函数的返回值一个类型的变量是没有生命用处的，因为类型的变量只能赋值为。和有一些区别的，函数没有返回值时返回类型为的方法，即使没有写明语句，也会在函数执行完的时候，隐式地返回一个类型。中新增加的变量声明方式。类型注解类型注解使用 :TypeAnnotation 语法。类型声明空间中可用的任何内容都可以用作类型注解。 const num: number = 123; fun...

dinfer 2019-08-26 10:43 评论0 收藏0
TypeScript 初识

摘要：当你陷在一个中大型项目中时应用日趋成为常态，没有类型约束类型推断，总有种牵一发而动全身的危机和束缚。总体而言，这些付出相对于代码的健壮性和可维护性，都是值得的。目前主流的都为的开发提供了良好的支持，比如和。参考资料中文文档文章博客地址：http://pinggod.com/2016/Typescript/ TypeScript 是 JavaScript 的超集，为 JavaScrip...

iliyaku 2019-08-19 18:47 评论0 收藏0
TypeScript 初识 - 内置对象

摘要：自带的内置对象都可以直接在中当作定义好的类型。的内置对象标准提供了常用的内置对象等。在不需要额外引入就可以直接使用这些内置对象用写不是内置对象的一部分，想要写时提示，需要引入第三方声明文件 JavaScript 自带的内置对象都可以直接在 TypeScript 中当作定义好的类型。 TypeScript 核心库的定义文件 TypeScript 核心库的定义文件定义了所有浏览器环境需要用...

lordharrd 2019-08-26 10:44 评论0 收藏0
TypeScript 初识 - 基础

摘要：安装通过命令进行安装创建文件文件名以扩展名结尾编译通过命令行进行编译通过运行任务的方式进行编译下使用显示运行任务，选择构建进行编译。安装通过 npm 命令进行安装： $ npm i -g typescript 创建 ts 文件 Typescript 文件名以 ts 扩展名结尾： function hello(value: string) { console.log(`hel...

CODING 2019-08-26 10:43 评论0 收藏0
TypeScript 初识 - 函数

摘要：函数类型函数返回值类型我们可以给每个参数添加类型之后再为函数本身添加返回值类型。能够根据返回语句自动推断出返回值类型，所以通常可以省略它匿名函数完整函数类型完整的函数类型包含两部分参数类型和返回值类型。函数是 JavaScript 的第一等公民，函数在 JavaScript 中可以实现抽象层、模拟类、信息隐藏和模块等等。TypeScript 在一定基础上扩展了函数的功能。函数类型 ...

ARGUS 2019-08-26 11:00 评论0 收藏0