Посібник, як з ним працювати

TypeScript – це розширення JavaScript, розроблене для створення більш надійного коду.

Застосування TypeScript дозволяє виявляти та виправляти помилки на ранніх етапах розробки. Однією з ключових можливостей TypeScript є перерахування (Enums). Перерахування – це популярний інструмент в TypeScript, який сприяє підвищенню безпеки коду.

У цій статті ми розглянемо, що таке Enums, як їх створювати і використовувати, а також інші важливі аспекти.

Що таке Enum?

Enum, або перерахування – це тип даних, який представляє набір іменованих констант. Іншими словами, змінна типу “перерахування” може приймати одне зі значень, визначених у цьому перерахуванні. Ці значення часто називають членами або елементами перерахування.

У нашому матеріалі ми будемо використовувати термін “члени”. Перерахування не є унікальною особливістю TypeScript, вони також використовуються в інших мовах програмування. Застосування перерахувань підвищує безпеку типів в проєктах TypeScript.

Також радимо ознайомитись: Найкращі бібліотеки TypeScript і середовища виконання, які повинен знати розробник

Навіщо потрібні Enums?

Перерахування допомагають визначити, які саме значення може містити змінна. Також вони дозволяють задати, які значення може приймати аргумент функції. Це гарантує, що розробники завжди використовують очікувані значення для змінних та аргументів, що мінімізує помилки та робить код більш безпечним та надійним.

Необхідні умови для роботи з Enum

У цьому посібнику ми розглянемо роботу з перерахуваннями у TypeScript. Щоб ефективно використовувати цей матеріал, ви повинні вміти запускати код TypeScript.

Для виконання JavaScript коду вам знадобиться встановлений Node.js. Якщо у вас ще не встановлено TypeScript, у відео нижче показано, як це зробити.

Для швидкої компіляції та виконання коду можна скористатись ts-node. Хоча ми будемо використовувати цей метод у статті, для великих проєктів рекомендується встановити TypeScript. Для запуску сценарію з ts-node використовуйте команду:

npx ts-node <scriptname>

Також передбачається, що ви знайомі з основами JavaScript та TypeScript.

Робота з простим перерахуванням

Створення простого Enum

Перерахування в TypeScript створюються за допомогою ключового слова `enum`. Після нього йде назва перерахування, а потім – список членів, які воно містить. Розглянемо приклад перерахування сторін світу на компасі:

enum Direction {
    North,
    East,
    South,
    West
}

Зверніть увагу, що члени перерахування не беруться в лапки, оскільки вони не є рядками.

Застосування простого Enum

Значення перерахування присвоюється змінній наступним чином:

const heading: Direction = Direction.North;

Оскільки тип даних визначається під час присвоєння, TypeScript може автоматично вивести тип змінної. Тому можна записати:

const heading = Direction.North;

Щоб дізнатися значення змінної `heading`, виведемо її в консоль:

console.log(heading);

Результат буде:

0

Змінна `heading` має значення 0, хоча ми присвоїли їй `Direction.North`. Це пов’язано з тим, що при створенні перерахування кожному члену присвоюється числове значення. Першому члену присвоюється 0, другому 1 і так далі. Ось демонстрація:

console.log(Direction.North, Direction.East, Direction.South, Direction.West)

Таким чином, можна перевірити, чи змінна `heading` має значення `North`, порівнюючи її з нулем. Наприклад:

// Asserting equality
let isNorth = heading == 0;

// Printing the result
console.log(isNorth);

Як показано, `Direction.North` дорівнює 0. Отже, замість перевірки, чи курс дорівнює нулю, можна перевірити, чи дорівнює він `Direction.North`:

// Checking if direction is North
isNorth = heading == Direction.North;

// Printing the result
console.log(isNorth);

Це корисний спосіб використання перерахувань, але їх можливості на цьому не обмежуються. Розглянемо, як можна використовувати налаштовані значення.

Робота з налаштованими значеннями

При створенні перерахування, TypeScript автоматично присвоює членам числові значення, починаючи з нуля. Однак можна задати кастомні значення замість стандартних, наприклад:

enum StarRating {
    VeryPoor = 1,
    Poor = 2,
    Average = 3,
    Good = 4,
    Excellent = 5
}

Або ж так:

enum StarRating {
    VeryPoor = 1,
    Poor,
    Average,
    Good,
    Excellent
}

У цьому випадку першому члену буде присвоєно значення 1. Наступні члени автоматично отримають значення на одиницю більше, ніж попередній. Таким чином, `Poor` матиме значення 2, `Average` – 3 і так далі.

Значення в перерахуванні не завжди мають бути числовими, про що ми поговоримо далі. Числові значення поводяться як звичайні числа.

console.log(typeof StarRating.Average);

Виведе “число”. Це означає, що можна виконувати будь-які операції з числами, наприклад, порівняння:

console.log(StarRating.Excellent > StarRating.Average)

Виведе “true”.

Рядкові значення як кастомні

Значення членів перерахування можуть бути рядковими, а не лише числовими. Ось як це реалізується:

enum Choice {
    RedPill = "Know Everything"
    BluePill = "Know Nothing"
}

У цьому випадку, значення членів будуть рядковими, тому можна виконувати рядкові операції, замість числових.

Гетерогенні перерахування

Можна використовувати як рядкові, так і числові значення в одному перерахуванні. Хоча це не рекомендується, і не має великого практичного застосування.

enum Mixed {
    First = "String"
    Second = 2
}

Підсумок

У цій статті ми розглянули перерахування (enums) у TypeScript, їх призначення та важливість. Також ми обговорили різні типи значень, які можуть мати члени перерахування.

Радимо ознайомитись з нашою статтею про різницю між `type` та `interface` у TypeScript.