**Якщо ви використовуєте TypeScript, ця стаття обов'язково до прочитання! 🔥 TypeScript має унікальні функції та ключові слова, які допомагають зробити наш код типобезпечним і надійним. У цій статті ми розглянемо їх, разом з відповідними прикладами та фрагментами коду! 😎

Магічний інструмент TypeScript: чистіший код, менше помилок! 🧰✨

Якщо ви використовуєте TypeScript, ця стаття обов'язково до прочитання! 🔥 TypeScript має унікальні функції та ключові слова, які допомагають зробити наш код типобезпечним і надійним. У цій статті ми розглянемо їх, разом з відповідними прикладами та фрагментами коду! 😎

1️⃣ is - Вбудований детектив TypeScript 🕵️‍♂️

В TypeScript, is — це унікальний тип захисту. Він допомагає визначити фактичний тип змінної. Припустимо, у нас є типи Dog та Cat, ми можемо використовувати is, щоб перевірити, до якого типу належить змінна.

Приклад 1: Собака проти Кота 🐶🐱

type Dog = { bark: () => void; };  
type Cat = { meow: () => void; };  

function isDog(pet: Dog | Cat): pet is Dog {  
 return (pet as Dog).bark !== undefined;  
}  

const pet: Dog | Cat = { bark: () => console.log('Woof!') };  

if (isDog(pet)) {  
 pet.bark(); // 🐶 Woof! Woof!  
} else {  
 pet.meow(); // 🐱 Meow!  
}

Ключове слово is зберігає типобезпечність нашого коду та покращує IntelliSense. 🧠✨

Більше прикладів is 🕵️‍♂️

Давайте розглянемо кілька цікавих і практичних прикладів використання ключового слова is! 😊

Приклад 2: Перевірка чисел проти рядків

function isNumber(value: unknown): value is number {  
 return typeof value === 'number';  
}  

const value: unknown = 42;  

if (isNumber(value)) {  
 console.log(value.toFixed(2)); // ✅ Безпечно використовувати як число  
} else {  
 console.log('Not a number');  
}

Тут функція isNumber перевіряє, чи є value числом. Якщо це число, ми можемо безпечно використовувати його. 🎯

Приклад 3: Перевірка кастомних типів

type Admin = { role: 'admin'; permissions: string[] };  
type User = { role: 'user'; username: string };  

function isAdmin(user: Admin | User): user is Admin {  
 return user.role === 'admin';  
}  

const currentUser: Admin | User = { role: 'user', username: 'john_doe' };  

if (isAdmin(currentUser)) {  
 console.log('Admin Permissions:', currentUser.permissions); // ✅ Адмін підтверджений  
} else {  
 console.log('User Name:', currentUser.username); // ✅ Користувач підтверджений  
}

Використовуючи isAdmin, ми перевіряємо, чи є змінна типом Admin. Як тільки тип підтверджено, IntelliSense працює безперебійно. 💻

2️⃣ keyof - Пошук властивостей 🔎

З keyof ми можемо отримати об'єднаний тип всіх властивостей з об'єкта.

Приклад:

type Person = { name: string; age: number; };  
type PersonKeys = keyof Person; // 'name' | 'age'

Тепер PersonKeys може бути лише 'name' або 'age'. Якщо ми зробимо помилку в написанні, TypeScript одразу це виявить! 😅

3️⃣ in - Перевірка наявності ключа 🔑

Оператор in перевіряє, чи існує властивість в об'єкті.

Приклад:

type Dog = { bark: () => void; };  
type Cat = { meow: () => void; };  

function isDog(pet: Dog | Cat): pet is Dog {  
 return 'bark' in pet;  
}  

const pet = { meow: () => console.log('Meow!') };  

if ('bark' in pet) {  
 console.log('It is a Dog!');  
} else {  
 console.log('It is a Cat!'); // 🐱 It is a Cat!  
}

4️⃣ typeof і keyof typeof - Магія типів і ключів ✨

З typeof ми можемо отримати тип змінної, а з keyof typeof — її ключі.

Приклад: Улюблені кольори 🎨

const colors = { red: '#FF0000', green: '#00FF00', blue: '#0000FF' };  
type ColorKeys = keyof typeof colors; // 'red' | 'green' | 'blue'

Тепер ColorKeys гарантує, що ми завжди вибираємо правильний ключ кольору.
Якщо є помилка в написанні, TypeScript нас про це повідомить! 🛑

5️⃣ Pick & Omit - Вибір або виключення властивостей 🍎🍊

• Pick дозволяє нам вибрати конкретні властивості.
• Omit дозволяє нам виключити конкретні властивості.

Приклад:

type Person = { name: string; age: number; address: string; };  
type PickedPerson = Pick<Person, 'name' | 'age'>; // { name: string; age: number; }  
type OmittedPerson = Omit<Person, 'address'>; // { name: string; age: number; }

6️⃣ Partial - Зробити все необов'язковим 🍴

Partial робить всі властивості необов'язковими.

Приклад:

type Person = { name: string; age: number; };  
type PartialPerson = Partial<Person>; // { name?: string; age?: number; }

Тепер, в PartialPerson можуть бути відсутні властивості name або age.

7️⃣ Required - Усі властивості мають бути присутні 🙋‍♂️

Required — це протилежність Partial. Всі властивості стають обов'язковими.

Приклад:

type OptionalPerson = { name?: string; age?: number; };  
type RequiredPerson = Required<OptionalPerson>; // { name: string; age: number; }

Тепер, в RequiredPerson повинні бути всі властивості. 😉

8️⃣ Readonly - Без змін 🚫

Readonly робить властивості незмінними.

Приклад:

type Person = { name: string; age: number; };  
type ReadonlyPerson = Readonly<Person>; // { readonly name: string; readonly age: number; }

Тепер властивості в ReadonlyPerson не можна змінювати. 🔒

9️⃣ unknown - Не впевнений, вирішу пізніше 🤔

unknown — це безпечніша версія any. Використовуйте її, коли ви не впевнені в типі.

Приклад:

let value: unknown = 'Hello';  
if (typeof value === 'string') {  
 console.log(value.toUpperCase()); // ✅ Безпечно використовувати  
}

* Бонус: Магія типів 🎩

1️⃣ Exclude - Видалити небажані типи 🚫

Exclude видаляє вказані типи з об'єднання.

Приклад:

type Animal = 'dog' | 'cat' | 'fish';  
type LandAnimal = Exclude<Animal, 'fish'>; // 'dog' | 'cat'

Тепер, LandAnimal містить тільки 'dog' та 'cat'.

2️⃣ Extract - Вибрати тільки те, що потрібно

Extract фільтрує конкретні типи з об'єднання.

Приклад:

type Animal = 'dog' | 'cat' | 'fish';  
type WaterAnimal = Extract<Animal, 'fish'>; // 'fish'

Тепер, WaterAnimal містить тільки 'fish'.

5. Висновок 🏁

Ці чудові можливості TypeScript допомагають зробити наш код типобезпечним, зручним для читання та потужним. 💪

У світі програмування ми можемо робити помилки, але TypeScript рятує нас від цих помилок. Тож, використовуйте TypeScript і насолоджуйтесь програмуванням! 🚀

💬 Яка функція вам найбільше подобається? Поділіться в коментарях!

Перекладено з: The Magic Toolbox of TypeScript: Cleaner Code, Fewer Errors! 🧰✨