Возможно, вам не нужен TypeScript Enum
В TypeScript существует функция Enum, которая не является расширением JavaScript на уровне типов. Enum позволяет разработчику определить набор именованных констант.
enum EDirection {
Up = "Up",
Down = "Down",
Left = "Left",
Right = "Right",
}
// Using the enum as a parameter
function walk(dir: EDirection) {}
walk(EDirection.Left);Но, с другой стороны, мы можем не использовать Enum, как утверждает команда TypeScript на сайте https://www.typescriptlang.org/docs/handbook/enums.html#objects-vs-enums, используя объект с параметром as const.
const ODirection = {
Up: "Up",
Down: "Down",
Left: "Left",
Right: "Right",
} as const;
type Direction = typeof ODirection[keyof typeof ODirection];
function run(dir: Direction) {}
run(ODirection.Right);Так в чем же разница между Enum и Object? Я расскажу о разнице в типах данных, размере бандла и о том, как использовать аспекты.
Типы данных
Enum
В TypeScript предусмотрены как числовые, так и строковые перечисления.
// Numeric Enums
enum UserResponse {
No = 0,
Yes = 1,
}
// String Enums
enum UserResponse {
No = "No",
Yes = "Yes",
}Константы
В то время как Constants могут охватывать объект со строковыми и числовыми значениями свойств, включая все типы данных.
// Number
const PI = 3.14159;
// String
const GREETING = "Hello, World!";
// Boolean
const IS_ACTIVE = true;
// Array
const COLORS = ["red", "green", "blue"];
// Object
const PERSON = {
name: "John",
age: 30
};
// RegExp
const EMAIL_PATTERN = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/;
// Null
const NO_VALUE = null;
// Undefined
const UNDEFINED_VALUE = undefined;
// Symbol
const UNIQUE_KEY = Symbol("unique");Транспонированный размер
Я использовал https://babeljs.io/repl, чтобы узнать размер после транспиляции кода.
Enum
enum Color {
Red = "RED",
Green = "GREEN",
Blue = "BLUE"
}
// Transpiled Result
var Color = /*#__PURE__*/function (Color) {
Color["Red"] = "RED";
Color["Green"] = "GREEN";
Color["Blue"] = "BLUE";
return Color;
}(Color || {});
// Size: 153 BytesConstants
const COLOR = {
red: "RED",
green: "GREEN",
blue: "BLUE"
} as const;
// Transpiled Result
const COLOR = {
red: "RED",
green: "GREEN",
blue: "BLUE"
};
// Size: 65 BytesСпособ применения
Enum с именем EDirection и объект с именем ODirection обозначают то же, о чём мы говорили ранее.
Enum
walk("Left");
// This shows an error ❌
// (Argument of type '"Left"' is not assignable to parameter of type 'EDirection')
walk(EDirection.Left);
// This works well ✅Constant
run("Left");
// This works well ✅
run(ODirection.Left);
// This works well ✅Заключение
Исходя из нескольких аспектов, рассмотренных ранее, мы можем заменить Enum на Object. Object обладает гибкостью в определении различных типов данных, имеет меньший размер транслита и может определять как значения свойств, так и доступ к ним.
Поэтому важно помнить, что не все "крутые" функции являются лучшим выбором. Всегда оценивайте те аспекты, которые считаете важными. Если функция не оказывает никакого негативного влияния, то ее можно смело использовать.
