Иногда функции могут работать и без передачи всех аргументов. Для таких случаев в TypeScript существуют опциональные параметры. Чтобы пометить параметр как необязательный, мы добавляем знак вопроса ? после его имени: function log(message?: string).
Важно помнить правило: обязательные параметры не могут следовать за опциональными. В теле функции такой параметр будет иметь тип Type | undefined, поэтому перед использованием его значения часто требуется проверка. Это позволяет писать гибкий код, который адаптируется под разные сценарии использования.
В этом уроке вы пройдете практические задания: научитесь правильно расставлять опциональные параметры, обрабатывать случай их отсутствия и избегать типичных ошибок. Интерактивная визуализация кода поможет понять разницу между undefined и переданным значением.
- Модуль 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. Знак опциональности
В этом задании вам нужно дополнить объявление функции на TypeScript, сделав один из параметров необязательным. Функция выводит приветствие для пользователя. Если параметр greeting не передан, используется значение по умолчанию. Вставьте необходимый синтаксический знак в отмеченное место, чтобы параметр стал опциональным, и код успешно компилировался и выполнялся.
function greet(name: string, greetinginput1S: string = 'Hello'): void {
console.log(`${greeting}, ${name}!`);
}
greet('Alice');
greet('Bob', 'Hi');2. Порядок параметров
В этом фрагменте кода TypeScript допущена синтаксическая ошибка: опциональный параметр объявлен перед обязательным. Однако после исправления этой ошибки вызовы функции также нужно изменить, чтобы сохранить первоначальную логику работы программы.
function greet(name?: string, message: string): string { return `${message}, ${name || 'Guest'}!`;} console.log(greet('Hello', 'John'));console.log(greet(undefined, 'Welcome'));3. Вызов функции
В этом задании вам предстоит заполнить пропуски в вызовах функции с опциональными параметрами. Функция `formatMessage` принимает обязательный параметр `text` (строка) и опциональный параметр `style` (строка). В зависимости от переданных аргументов функция возвращает отформатированное сообщение. Используйте выпадающие списки, чтобы выбрать подходящие значения для каждого вызова, учитывая, что опциональный параметр можно опустить или передать явно.
function formatMessage(text: string, style?: string): string {
if (style === 'uppercase') {
return text.toUpperCase();
} else if (style === 'lowercase') {
return text.toLowerCase();
}
return text;
}
// Вызовы функции
const result1 = formatMessage(input1S);
const result2 = formatMessage(input2S, input3S);
const result3 = formatMessage(input4S, input5S);4. Функция с проверкой
Из предложенных строк соберите корректную TypeScript-функцию, которая принимает опциональный параметр name типа string и выводит приветствие. Если параметр передан, функция выводит 'Hello,
function greet(name?: string): void { if (name) { console.log(`Hello, ${name}!`); } else { console.log("Hello, stranger!"); }}function greet(name: string): void { if (name === undefined) { console.log("Hello!");5. Результат при отсутствии аргумента
Проанализируйте приведённый код на TypeScript. Обратите внимание на объявление функции с опциональным параметром. Что будет выведено в консоль при вызове функции без аргументов? Выберите один правильный вариант ответа.
function printName(name?: string): void {
console.log("Name:", name);
}
printName();6. Поиск опциональных параметров
Внимательно изучите сигнатуру функции на TypeScript. Отметьте все параметры функции, которые являются опциональными (помечены знаком вопроса). Не отмечайте обязательные параметры, параметры со значениями по умолчанию, rest-параметры, имя функции, ключевые слова и типы.
{{function~|~t0}} {{process~|~t1}}({{input: string~|~t2}}, {{delimiter?: string~|~t3}}, {{limit: number = 10~|~t4}}, {{strict?: boolean~|~t5}}, {{encoding?: string~|~t6}}, {{callback?: (result: string) => void~|~t7}}, {{...extras: any[]~|~t8}}){{: string~|~t9}};7. Логика обработки undefined
Проанализируйте TypeScript-код сверху и восстановите последовательность логических шагов выполнения программы. Шаги снизу перемешаны — расставьте их в правильном порядке, чтобы отразить, как программа обрабатывает вызов функции без аргумента и что выводит в консоль.
function greet(name?: string): void {
if (name === undefined) {
name = 'Guest';
}
console.log(`Hello, ${name}!`);
}
greet();8. Анатомия опционального параметра
В приведённой сигнатуре функции найдите опциональный параметр и разметьте его составные части: имя параметра, знак вопроса, указывающий на его необязательность, и тип данных. Для этого выберите для каждого выделенного фрагмента соответствующий тип из списка.
function sendMessage(recipient: string, {{text~|~t1}}{{?~|~t2}}: {{string~|~t3}}, priority: number = 1) {
// ... тело функции
}