Я IT-специалист, ментор и основатель проекта YeaHub и сообщества Reactify. Здесь рассказываю про Frontend и IT.
Менторство:
https://reactify.ru
YouTube канал:
https://youtube.com/@reactify-it
YeaHub:
https://yeahub.ru/
Связь:
@ruslan_kuyanets
Post #1222
2.48K
👩💻 Type Guards в TypeScript
Type Guards - это выражения, проверяющие тип в runtime. Они позволяют сузить тип переменной в блоке кода.
📌 Оператор typeof:
typeof проверяет тип значения во время выполнения. Если val - строка, выполняется первый блок, где доступны строковые методы. Иначе val считается числом, и доступны числовые методы.
📌 Оператор instanceof:
instanceof проверяет, является ли объект экземпляром определённого класса. Если animal - экземпляр Dog, вызывается bark(). В противном случае считается, что это Cat, и вызывается meow().
📌 Пользовательские Type Guards:
isFish - это пользовательская функция-проверка типа. Она проверяет наличие метода swim. Если метод есть, функция возвращает true, и TypeScript считает pet объектом типа Fish. Иначе pet считается Bird.
#frontend #react #typescript
Type Guards - это выражения, проверяющие тип в runtime. Они позволяют сузить тип переменной в блоке кода.
📌 Оператор typeof:
typeof проверяет тип значения во время выполнения. Если val - строка, выполняется первый блок, где доступны строковые методы. Иначе val считается числом, и доступны числовые методы.
function processValue(val: string | number) {
if (typeof val === "string") {
console.log(val.toUpperCase()); // val имеет тип string
} else {
console.log(val.toFixed(2)); // val имеет тип number
}
}
📌 Оператор instanceof:
instanceof проверяет, является ли объект экземпляром определённого класса. Если animal - экземпляр Dog, вызывается bark(). В противном случае считается, что это Cat, и вызывается meow().
class Dog {
bark() {}
}
class Cat {
meow() {}
}
function makeSound(animal: Dog | Cat) {
if (animal instanceof Dog) {
animal.bark(); // animal имеет тип Dog
} else {
animal.meow(); // animal имеет тип Cat
}
}
📌 Пользовательские Type Guards:
isFish - это пользовательская функция-проверка типа. Она проверяет наличие метода swim. Если метод есть, функция возвращает true, и TypeScript считает pet объектом типа Fish. Иначе pet считается Bird.
interface Fish { swim: () => void; }
interface Bird { fly: () => void; }
function isFish(pet: Fish | Bird): pet is Fish {
return (pet as Fish).swim !== undefined;
}
function move(pet: Fish | Bird) {
if (isFish(pet)) {
pet.swim(); // pet имеет тип Fish
} else {
pet.fly(); // pet имеет тип Bird
}
}
#frontend #react #typescript
- 👍 15
- ❤ 2
- 🔥 2
