Equality narrowing — это механизм TypeScript, который сужает тип переменной после проверки на равенство. Когда ты сравниваешь значение с конкретным литералом или другой переменной, компилятор понимает более точный тип внутри условия.
Пример:
function process(x: string | number) {
if (x === "hello") {
// здесь x имеет тип "hello"
}
}
- Работает с операторами
===,!==,==,!= - Можно сравнивать с
null,undefined, литералами - После проверки TypeScript «знает» более точный тип
Этот тренажёр по TypeScript поможет понять, как использовать проверки равенства для сужения типов в реальном коде.
- Модуль 1: Введение в TypeScript
- Модуль 2: Примитивные типы
- Модуль 3: Специальные типы
- Модуль 4: Массивы
- Модуль 5: Кортежи (Tuples)
- Модуль 6: Объекты
- Модуль 7: Функции
- Модуль 8: Union типы
- Модуль 9: Литеральные типы
- Модуль 10: Type Aliases
- Модуль 11: Интерфейсы
- Модуль 12: Type Guards и Narrowing
- Модуль 13: Enums
- Модуль 14: Классы
- Модуль 15: Generics — основы
- Модуль 16: Generics — ограничения
- Модуль 17: Utility Types — базовые
- Модуль 18: Utility Types — работа с Union
- Модуль 19: Utility Types — функции
- Модуль 20: Type Assertions
- Модуль 21: Keyof и Typeof операторы
- Модуль 22: Mapped Types
- Модуль 23: Conditional Types
- Модуль 24: Discriminated Unions
- Модуль 25: Модули и типы
- Модуль 26: Declaration Files
- Модуль 27: Типизация асинхронного кода
- Модуль 28: Практические паттерны
1. Добавь проверку равенства
Дан код функции processValue, которая принимает параметр value типа string | number. Внутри условия нужно вставить оператор сравнения и значение для сужения типа так, чтобы в блоке if TypeScript рассматривал value как строку. Заполните пропуски, чтобы код корректно выполнялся. Обратите внимание на комментарий в коде.
function processValue(value: string | number) {
// сравните со строкой "hello"
if (value input1S input2S) {
console.log(value.toUpperCase());
} else {
console.log(value);
}
}2. Исправь проверку
В этом фрагменте кода TypeScript используется сужение типов (type narrowing) через проверку равенства (equality narrowing), но допущена ошибка в операторе сравнения. Исправьте строку с ошибкой, чтобы функция корректно определяла тип переменной и выводила соответствующее сообщение. Обратите внимание на правильный оператор для сравнения значений.
function processValue(value: string | null) { if (value = "hello") { console.log("Greeting received"); } else { console.log("No greeting"); }}3. Собери код с narrowing
Из предложенных строк соберите корректную TypeScript-функцию, которая использует сужение типов (equality narrowing). Функция принимает параметр типа string | number и выводит приветствие: если значение равно строке 'admin', то выводит 'Welcome, admin!', иначе выводит 'Hello, user!'. Одна из строк лишняя и в решение входить не должна.
function processValue(value: string | number) { if (value === 'admin') { console.log('Welcome, admin!'); } else { console.log('Hello, user!'); } console.log('This is a decoy');4. Какой тип после проверки?
Рассмотрите приведенный код на TypeScript. Внутри условия if выполняется проверка на равенство переменной конкретному значению. Какой тип будет у переменной status внутри блока if? Выберите один правильный вариант из предложенных. Обратите внимание на union-тип переменной и механизм сужения типов (narrowing) через проверку равенства.
let status: "success" | "error" | "loading";
status = "success";
if (status === "success") {
// Какой тип у status здесь?
console.log(status.toUpperCase());
}5. Логика сужения типа
Проанализируйте TypeScript-код сверху и восстановите последовательность логических шагов выполнения программы. Шаги снизу перемешаны — расставьте их в правильном порядке, чтобы отразить, как программа обрабатывает входные данные с использованием equality narrowing (сужения типов через проверку на равенство).
function processValue(value: string | null): void {
if (value === null) {
console.log('Значение отсутствует');
} else {
console.log(`Длина строки: ${value.length}`);
}
}
// Входные данные
processValue('Hello');
processValue(null);else: тип value сужается до string, вычисляется длина строкиnull с помощью === (equality narrowing)if: тип value сужается до null, выполняется действие для отсутствующего значенияprocessValue с аргументом null (тип string | null)Значение отсутствует (для второго вызова)Длина строки: 5 (для первого вызова)processValue с аргументом 'Hello' (тип string | null)6. Проверки и результаты
В левой колонке приведены различные проверки равенства (===, !==) в TypeScript, а в правой — типы, к которым сужается переменная в соответствующей ветке кода после выполнения проверки. Сопоставьте каждую проверку слева с правильным типом справа. Обратите внимание, что в правой колонке нет лишних вариантов, но порядок типов перемешан.
value === nullvalue !== undefinedvalue === 'success'value === falsevalue === 0null0false'success'T (без undefined)7. Разметь части narrowing
В данном коде TypeScript используется сужение типов через равенство (equality narrowing). Разметьте следующие элементы: union-тип параметра функции, оператор сравнения, значение для сравнения, суженный тип (указанный в комментарии) и действие, которое выполняется с суженным типом. Для разметки доступны категории: Union-тип, Оператор сравнения, Значение сравнения, Суженный тип, Действие с суженым типом.
function processValue(value: {{string | number~|~t1}}) {
if (value {{===~|~t2}} {{"admin"~|~t3}}) {
// value - {{string~|~t4}}
console.log(value.{{toUpperCase()~|~t5}});
}
}