Як використовувати твердження типу TypeScript

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

Що таке твердження типу?

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

Синтаксис тверджень типу

Існує два способи використання твердження типу в TypeScript:

• Використання ключового слова as (рекомендовано)
• Використання кутових дужок <>

Використання ключового слова as

Найпоширенішим способом використання тверджень типу є використання ключового слова as:

let someValue: unknown = "Hello, TypeScript!";
let strLength: number = (someValue as string).length;

console.log(strLength); // Output: 17

У цьому прикладі ми повідомляємо TypeScript, що someValue має тип string, що дозволяє нам використовувати властивість length.

Використання кутових дужок <>

Альтернативний синтаксис для тверджень типу використовує кутові дужки:

let someValue: unknown = "Hello, TypeScript!";
let strLength: number = (someValue).length;

console.log(strLength); // Output: 17

Цей синтаксис забезпечує той самий результат, що й синтаксис as. Однак це не рекомендується в середовищах, де використовується JSX (наприклад, React), оскільки це конфліктує з синтаксисом елементів JSX.

Загальні випадки використання тверджень типу

Твердження типу зазвичай використовуються в кількох сценаріях:

• При роботі з типом unknown
• При обробці елементів DOM
• При звуженні типів союзів
• Під час взаємодії зі сторонніми бібліотеками, у яких відсутні визначення типів

Приклад: підтвердження типів із типом unknown

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

function getLength(value: unknown): number {
  if (typeof value === "string") {
    return (value as string).length;
  } else if (Array.isArray(value)) {
    return (value as any[]).length;
  }
  return 0;
}

console.log(getLength("Hello")); // Output: 5
console.log(getLength([1, 2, 3])); // Output: 3
console.log(getLength(42)); // Output: 0

У цьому прикладі ми використовуємо твердження типу, щоб повідомити TypeScript, що value є рядком або масивом any[].

Приклад: робота з елементами DOM

Під час маніпулювання DOM TypeScript повинен знати конкретний тип елемента, щоб надати відповідні властивості та методи. Тут корисні твердження типу:

const inputElement = document.getElementById("user-input") as HTMLInputElement;
inputElement.value = "Hello, TypeScript!";

Тут ми використовуємо твердження типу, щоб повідомити TypeScript, що inputElement є HTMLInputElement, що дозволяє нам отримати прямий доступ до властивості value.

Ствердження типу проти приведення типу

Важливо розуміти різницю між твердженням типу та приведенням типу. У TypeScript твердження типу не змінюють фактичний тип під час виконання; вони лише повідомляють компілятору TypeScript, як обробляти тип під час компіляції. На відміну від цього, приведення типів в інших мовах, таких як C# або Java, може передбачати перетворення значення з одного типу в інший під час виконання, що може вплинути на продуктивність і поведінку.

Застереження під час використання тверджень типу

Хоча твердження типу можуть бути потужними, неправильне використання може призвести до помилок виконання. Ось кілька порад щодо їх безпечного використання:

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

Приклад твердження неправильного типу

Ось приклад твердження небезпечного типу:

let someValue: string = "Hello, TypeScript!";
let numValue: number = (someValue as unknown as number); // Dangerous!

console.log(numValue); // Output: Hello, TypeScript! (incorrect)

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

Висновок

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

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