Parameters

Тренажер по TypeScript для пользователей с начальным уровнем подготовки.

Тренажер по TypeScript

Utility Type Parameters<T> позволяет извлекать типы аргументов функции и представлять их в виде кортежа (tuple). Это невероятно полезно при разработке оберток, декораторов или когда вам нужно повторно использовать тип аргументов чужой функции, который не был экспортирован отдельно.

Синтаксис выглядит как Parameters<typeof MyFunc>. Если функция принимает (name: string, age: number), то Parameters вернет тип [string, number]. Вы можете обращаться к конкретным аргументам по индексу, например Parameters<...>[0]. Эти уроки и интерактивные тесты научат вас динамически выводить типы из функций, делая ваш код более гибким (DRY — Don't Repeat Yourself).

Список тем

1. Использование typeof

id: 40733_ts_params_01_syntax

В этом задании вам нужно применить утилитный тип Parameters для извлечения типов параметров функции. В предоставленном фрагменте кода пропущено ключевое слово, необходимое для корректной работы с функцией как с типом. Ваша задача — вставить пропущенный элемент так, чтобы тип GreetParams корректно представлял кортеж типов параметров функции greet. Обратите внимание, что для получения типа функции в контексте утилитных типов требуется специальный оператор.

Заполните пропуски
function greet(name: string, age: number): string {
  return `Hello, ${name}. You are ${age} years old.`;
}

// Извлеките тип параметров функции greet
type GreetParams = Parameters<input1S greet>; // Ожидаемый тип: [string, number]

// Пример использования
const params: GreetParams = ['Alice', 30];
Сообщения
Проверить
Показать решение на 3 сек.
Показать подсказку

2. Получение типа по индексу

id: 40733_ts_params_02_get_index

В данном фрагменте кода TypeScript объявляется функция с двумя параметрами и используется утилитный тип Parameters для извлечения типа второго параметра. Определите, какой тип будет получен при обращении к элементу кортежа с индексом 1. Введите одно слово - название типа (например, string, number, boolean и т.д.).

Что должно получиться?
function example(a: boolean, b: string): void {
  // тело функции
}

type Params = Parameters<typeof example>;
type SecondParam = Params[1]; // какой тип будет у SecondParam?
Сообщения
Проверить
Показать подсказку

3. Определение типа параметров

id: 40733_ts_params_03_choose_def

В этом задании вам нужно определить тип переменной, чтобы она соответствовала параметрам функции. Используйте утилитный тип Parameters для извлечения типов аргументов функции. В коде ниже есть пропуски, которые нужно заполнить, выбрав подходящие варианты из выпадающего списка. Обратите внимание на синтаксис TypeScript и правильное использование дженериков.

Нужно правильно расставить в пропуски предложенные варианты
function processData(name: string, age: number, active: boolean): void {
  console.log(`Name: ${name}, Age: ${age}, Active: ${active}`);
}

// Определите тип параметров функции processData
let params: input1S = ['Alice', 30, true];

// Используйте params для вызова функции
processData(...params);
Сообщения
Проверить
Показать решение на 3 сек.
Показать подсказку

4. Повторное использование аргументов

id: 40733_ts_params_04_reuse_args

Из предложенных строк соберите корректную TypeScript-программу, которая создаёт новую функцию `logAndCall`, принимающую те же аргументы, что и исходная функция `multiply`, используя spread operator и Utility Type `Parameters`. Новая функция должна логировать аргументы перед вызовом исходной функции и возвращать её результат. Лишние строки в решение включать не нужно.

Перетяните в правильном порядке строки из одного блока в другой
function multiply(a: number, b: number): number {
    return a * b;
}
const logAndCall = (...args: Parameters<typeof multiply>) => {
    console.log('Arguments:', args);
    return multiply(...args);
};
const result = logAndCall(5, 3);
console.log('Result:', result);
const wrongCall = logAndCall(5);
console.log(multiply(2, 4));
Сообщения
Проверить
Показать решение на 3 сек.
Показать подсказку

5. Передача значения вместо типа

id: 40733_ts_params_05_pass_value_error

В этом фрагменте TypeScript-кода допущена ошибка при использовании утилиты типа Parameters. Вместо типа функции передается её значение, что приводит к ошибке компиляции. Найдите и исправьте строку с ошибкой, чтобы правильно извлечь типы параметров функции.

Найдите ошибку и исправьте
function formatUser(name: string, age: number): string {
  return `${name} (${age})`;
}
 
// Ошибка: передается значение функции, а не её тип
type FormatParams = Parameters(formatUser);
 
const params: FormatParams = ['Alice', 30];
Сообщения
Проверить
Показать решение на 3 сек.
Показать подсказку

6. Что попадет в кортеж?

id: 40733_ts_params_06_map_visual

Перед вами объявление функции на TypeScript. Внимательно изучите сигнатуру функции. Ваша задача — отметить (кликнуть) все типы аргументов функции, которые будут включены в кортеж, возвращаемый утилитным типом `Parameters`. Не отмечайте имя функции, generic-параметры (в угловых скобках), возвращаемый тип, скобки, запятые или ключевые слова.

Кликните по всем фрагментам, которые подходят под условие задания.
{{function~|~t0}} {{process~|~t1}}<{{T~|~t2}}>({{id~|~t3}}: {{T~|~t4}}, {{count~|~t5}}: {{number~|~t6}}, {{label~|~t7}}: {{string~|~t8}}): {{void~|~t9}} {}
Сообщения
Проверить
Показать подсказку

7. Функция - Кортеж

id: 40733_ts_params_07_match_tuples

В левой колонке приведены сигнатуры функций TypeScript. В правой колонке — результаты применения утилитарного типа Parameters к этим функциям, представленные в виде кортежей типов. Сопоставьте каждую сигнатуру функции (слева) с соответствующим кортежем типов её параметров (справа). Обратите внимание на типы параметров, их количество и модификаторы (например, опциональные параметры или параметры с типом по умолчанию).

Сопоставьте строки в правой(нижней) части с соответствующими строками в левой(верхней) по порядковому номеру
(x: number, y: string): void
(a: boolean, b?: number): boolean
<T>(items: T[], index: number): T
(name: string = 'guest'): string
(...args: number[]): number
[boolean, number | undefined]
[number, string]
[T[], number]
[...number[]]
[string]
Сообщения
Проверить
Показать подсказку

TypeScript: компиляция и запуск

id: 40733_compiler
TS
Запустить тренажёр (TypeScript)
НайтиКурс.Ру