Note: If you're new to TypeScript, check our Getting Started with TypeScript tutorial first.
In TypeScript, rest parameters allow a function to accept an indefinite number of arguments as a single array.
They are indicated by the ...
symbol before the parameter name.
Here's a simple example of rest parameters in TypeScript. You can read the rest of the tutorial to learn more.
Example
function addNumbers(...numbers: number[]): number{
let sum: number = 0;
for (let num of numbers) {
sum += num;
}
return sum;
}
console.log(addNumbers(5, 10, 15)); // Output: 30
console.log(addNumbers(5, 10)); // Output: 15
console.log(addNumbers(5)); // Output: 5
console.log(addNumbers()); // Output: 0
In this example, numbers
is a rest parameter of number
type. As such, it can accept any number of arguments.
Syntax for Defining a Rest Parameter
You can create a rest parameter using the ...
symbol before the parameter name.
Since rest parameters are arrays, you also need to use the []
symbol when specifying its type.
Here's the syntax for defining a rest parameter in your function:
function functionName(...restParameterName: type[]) {
// Function body
}
Here,
...
- Indicates that we're defining a rest parameter.restParameterName
- The name of the rest parameter.type[]
- The type of the array that constitutes the rest parameter.
Notes:
- You can have any number of normal parameters before the rest parameter.
- The rest parameter must come after the normal parameters, never before. Breaking this rule will result in an error.
Example: TypeScript Rest Parameters
// Function with rest parameter 'deposits'
function studentInfo(name: string, ...marks: number[]): void {
console.log(`Student Name: ${name}`);
console.log("Marks Obtained:");
// Print the rest parameter
for (let mark of marks) {
console.log(mark);
}
console.log();
}
// Pass a single argument to the rest parameter
studentInfo("Joe Smith", 100);
// Pass two arguments to the rest parameter
studentInfo("Jane Doe", 85, 92);
Output
Student Name: Joe Smith Marks Obtained: 100 Student Name: Jane Doe Marks Obtained: 85 92
Here's how the program works:
1. When studentInfo("Joe Smith", 100) is called.
name
is"Joe Smith"
.- The
marks[]
array (i.e., the rest parameter) has only one element: 100.
2. When studentInfo("Jane Doe", 85, 92) is called.
name
is"Jane Doe"
.- The
marks[]
array has two elements: 85 and 92.
More on Rest Parameters
You can use a union type to ensure your rest parameter can take arguments of multiple types. For example,
// Function with rest parameter that can take number or string arguments
// The function returns a tuple of number and string
function addConcat(...args: (number | string)[]): [number, string] {
let sum: number = 0;
let message: string = "";
for (let arg of args) {
if (typeof arg === "number") {
sum += arg;
}
else {
message += arg;
}
}
return [sum, message];
}
// Call the function
// Pass numbers and strings in random order
let [total, text]: [number, string] = addConcat(12, 2, 3, "Hasta ", 1, "la vista");
console.log(total); // 18
console.log(text); // Hasta la vista
Here, the rest parameter args can take any number of arguments that are either numbers or strings.
- If an individual argument turns out to be a number, it is added to the
sum
variable. - But if it's a string, it is concatenated (joined) to the
message
string.
Also Read: