0Pricing
TypeScript Academy · Урок

Остаточные параметры функций

Задавайте типы функций, принимающих любое количество аргументов

«Остаточные параметры функций» — бесплатный урок TypeScript Academy на CoddyKit. Это урок 1 из 4. Ты можешь прочитать весь урок бесплатно ниже — а потом практиковать его прямо в браузере с встроенным редактором кода и ИИ-репетитором 24/7. Это часть пути обучения TypeScript Academy, и твой прогресс синхронизируется между веб-версией и приложением CoddyKit. Курс TypeScript Academy содержит 4 уроков всего.

Функции с множеством аргументов

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

Базовый остаточный параметр

Поставьте ... перед последним параметром и задайте ему тип массива. Внутри функции он ведёт себя как обычный массив.

function sum(...nums: number[]): number {
  return nums.reduce((a, b) => a + b, 0)
}
console.log(sum(1, 2, 3, 4)) // 10

Вызов без аргументов

Остаточный параметр может соответствовать нулю аргументов — массив просто будет пустым. Для случая без аргументов не требуется специальная обработка.

function sum(...nums: number[]): number {
  return nums.reduce((a, b) => a + b, 0)
}
console.log(sum()) // 0

Остаточный параметр после фиксированных параметров

Остаточный параметр может следовать за фиксированными параметрами, но он должен быть последним. Сначала связываются фиксированные параметры, а всё оставшееся попадает в остаточный массив.

function join(separator: string, ...parts: string[]): string {
  return parts.join(separator)
}
console.log(join("-", "a", "b", "c")) // a-b-c

Только один остаточный параметр и всегда последним

Можно объявить не более одного остаточного параметра, и после него ничего не должно быть. Параметр после остаточного приводит к синтаксической ошибке.

// function bad(...nums: number[], last: number) {} // Error
function ok(first: number, ...rest: number[]) {
  return first + rest.length
}
console.log(ok(10, 1, 2)) // 12

Ограничения типов элементов

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

function tags(...labels: string[]): string {
  return labels.join(",")
}
console.log(tags("a", "b"))
// tags("a", 5) // Error: 5 is not a string

Остаточный параметр с объединением типов

Типом элементов может быть объединение, допускающее аргументы разных типов. Внутри функции сузьте тип каждого элемента перед использованием.

function show(...items: (string | number)[]): string {
  return items.map(String).join(" ")
}
console.log(show("x", 1, "y", 2)) // x 1 y 2

Остаточный параметр с типом кортежа

Остаточный параметр можно типизировать как кортеж, чтобы описать структуру с фиксированной частью и переменным числом элементов. Здесь первый аргумент является строкой, за которой следует любое количество чисел.

function record(...args: [string, ...number[]]): string {
  const [label, ...values] = args
  return label + ": " + values.join(",")
}
console.log(record("scores", 9, 8, 7))

Остаточный кортеж задаёт количество аргументов

При типе остаточного кортежа начальные элементы обязательны. Пропуск обязательного первого аргумента вызывает ошибку компиляции — это более строгое ограничение, чем у обычного массива.

function record(...args: [string, ...number[]]): number {
  return args.length
}
console.log(record("x")) // 1
// record() // Error: missing string argument

Передача массива в вызов с остаточным параметром

Существующий массив можно передать в остаточный параметр, используя разворачивание в месте вызова. Тип элементов массива должен соответствовать типу параметра.

function sum(...nums: number[]): number {
  return nums.reduce((a, b) => a + b, 0)
}
const values = [1, 2, 3]
console.log(sum(...values)) // 6

Остаточные параметры на практике

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

function max(first: number, ...rest: number[]): number {
  return rest.reduce((m, n) => (n > m ? n : m), first)
}
console.log(max(3, 7, 2, 9, 1)) // 9

Быстрая проверка

Проверьте, насколько хорошо Вы поняли типизированные остаточные параметры.

Итоги

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

Часто задаваемые вопросы

Урок «Остаточные параметры функций» бесплатный?

Да — полный текст урока «Остаточные параметры функций» бесплатно доступен здесь в веб-версии. Чтобы практиковать его интерактивно (встроенный редактор кода и ИИ-репетитор 24/7) и разблокировать остальной курс TypeScript Academy, подпишись на CoddyKit PRO. Курс TypeScript Academy содержит 4 уроков всего.

Чему я научусь в уроке «Остаточные параметры функций»?

Задавайте типы функций, принимающих любое количество аргументов Ты практикуешь TypeScript Academy с помощью реального кода, который запускаешь прямо в браузере, и ИИ-репетитор 24/7 отвечает на твои вопросы во время урока.

Нужен ли мне опыт, чтобы начать TypeScript Academy?

Предыдущий опыт не требуется. TypeScript Academy на CoddyKit структурирован для всех уровней — от новичков до продвинутых, поэтому ты можешь начать отсюда или с самого начала и учиться в своем темпе. Это урок 1 из 4.

Сколько времени занимает урок «Остаточные параметры функций»?

Большинство уроков CoddyKit занимают около 5–10 минут. Каждый из них компактный и интерактивный, поэтому ты постоянно делаешь прогресс и продолжаешь с того же места в веб-версии и приложении.

Можно ли писать и запускать код в этом уроке TypeScript Academy?

Да. Каждый урок TypeScript Academy включает встроенный редактор кода, поэтому ты пишешь и запускаешь реальный код прямо в браузере и получаешь моментальную обратную связь от AI — локальная установка не требуется.

Все уроки этого курса

  1. Остаточные параметры функций
  2. Оператор spread в массивах и объектах
  3. Остаточные элементы кортежей
  4. Типизация функций с переменным числом аргументов
← Назад к TypeScript Academy