6️⃣ 🧠 Functions in TypeScript
Estimated reading: 4 minutes 433 views

TypeScript — Rest Parameters: Handle Variable-Length Arguments with Type Safety

Introduction – What Are Rest Parameters in TypeScript?

In TypeScript, rest parameters allow you to accept an unlimited number of arguments as a single array within a function. Using the ... (spread) operator in function definitions, you can collect all remaining parameters into one variable. This is incredibly useful when dealing with variadic functions, callbacks, utility operations, or handling flexible data input.

In this guide, you’ll learn:

  • How to declare and use rest parameters
  • Type annotations for rest parameters
  • Difference between rest and spread operators
  • Real-world examples and best practices

Syntax of Rest Parameters in TypeScript

Rest parameters are written with the ... prefix before a parameter name, and are always placed at the end of the parameter list.

Example:

function logMessages(...messages: string[]): void {
  messages.forEach((msg) => console.log(msg));
}

Usage:

logMessages("Hello", "Welcome", "TypeScript"); 
// Output:
// Hello
// Welcome
// TypeScript

Explanation:

  • ...messages collects all passed string arguments into an array.

Rest Parameter with Fixed and Variable Arguments

You can mix fixed parameters and rest parameters, but the rest must always come last.

function greetAll(greeting: string, ...names: string[]): void {
  names.forEach((name) => {
    console.log(`${greeting}, ${name}`);
  });
}

greetAll("Hi", "Alice", "Bob", "Charlie");
// Output:
// Hi, Alice
// Hi, Bob
// Hi, Charlie

Rest Parameters vs Spread Operator

FeatureRest ParameterSpread Operator
Used in Function Definition Yes (...args: Type[]) No
Used in Function Call No Yes (...array)
PurposeCollects arguments into an arrayExpands array into individual elements

Example of Spread:

const numbers = [1, 2, 3];
logMessages(...numbers.map(String)); // Using spread to pass each value

Typing Rest Parameters in TypeScript

You must specify the array type of the rest parameter.

function sum(...nums: number[]): number {
  return nums.reduce((total, n) => total + n, 0);
}

console.log(sum(10, 20, 30)); // 60

Note: TypeScript automatically infers the rest parameter as an array of the given type.


Using Tuples with Rest Parameters

TypeScript supports rest parameters with tuple types for advanced typing:

type LoggerArgs = [level: string, ...messages: string[]];

function log(...args: LoggerArgs): void {
  const [level, ...messages] = args;
  messages.forEach((msg) => console.log(`[${level}] ${msg}`));
}

log("INFO", "App started", "User logged in");

This gives fine-grained control over argument types and order.


Real-World Use Cases

  • Utility functions that accept any number of inputs (sum, concat, merge)
  • Logging systems with flexible arguments
  • Validation functions handling multiple fields
  • Middleware chaining and event listeners
  • Test data generators accepting varying inputs

Common Mistakes & How to Avoid Them

Mistake Solution
Placing rest parameter firstAlways put rest parameters at the end of the parameter list
Using incorrect type annotationUse Type[], not Type (e.g., string[], not string)
Mixing types without validationUse union or generic types for mixed-type arguments
Forgetting rest destructuringUse [...rest] = array or rest in parameter lists properly

Best Practices for Rest Parameters

  • Use rest parameters for functions with flexible argument length
  • Explicitly type rest arguments to improve safety
  • Keep the rest parameter as the last argument
  • Combine with default or optional parameters when needed
  • Avoid using any[] unless necessary—prefer specific types

Summary – Recap & Next Steps

Rest parameters in TypeScript allow you to write flexible, clean, and type-safe functions that can handle varying numbers of arguments with ease. They are essential when building utility libraries, APIs, or components that support dynamic input.

Key Takeaways:

  • Use ...parameterName: Type[] to collect arguments
  • Rest parameters must be the last in the parameter list
  • Type rest parameters as arrays (e.g., number[], string[])
  • Combine with tuple types for advanced argument control

Real-world relevance: Rest parameters are widely used in array utilities, form handlers, middleware stacks, event loggers, and UI component props.


FAQs – Rest Parameters in TypeScript

Can I have multiple rest parameters in one function?
No. Only one rest parameter is allowed, and it must be last.

Can I use rest parameters with default parameters?
Yes, but default parameters must come before the rest parameter.

What is the difference between rest and spread?
Rest collects values into an array (function definition), spread expands arrays (function calls).

Are rest parameters typed as any[] by default?
No. TypeScript infers the type, but you should explicitly annotate for safety.

Can rest parameters be used in arrow functions?
Yes. Rest syntax works in all function styles including arrow functions.


Share Now :
Share

TypeScript — Rest Parameter

Or Copy Link

CONTENTS
Scroll to Top