Typed tuple concatenation
Combine two parameter or data sequences while retaining each tuple element's position and type.
TypeScript · Function
Variadic Tuple Types
Variadic tuple types let generic spreads capture and rebuild tuple or array sequences. They support tuple concatenation, fixed elements around variable segments, and strongly typed function composition.
- Since
- TypeScript 4.0
How it works
A variadic tuple type uses spread syntax in a tuple declaration to represent an unknown tuple segment. Generic spreads let a function capture tuple types and reconstruct a new tuple by placing those segments before, after, or around other elements.
Syntax
type Result = [...T, ...U]Parameters
| Name | Type | Description |
|---|---|---|
T | T extends readonly any[] | First tuple or array sequence to preserve and place in the output. |
U | U extends readonly any[] | Second tuple or array sequence to preserve and place after the first sequence. |
Returns
A tuple or array sequence formed by spreading T followed by U: [...T, ...U].
Key points
- Tuple spread segments may use generic type parameters, allowing declarations to preserve and transform caller-provided tuple shapes.
- Variadic tuples support type-level operations that manipulate tuple and array sequences, including function composition patterns.
- A generic spread becomes a concrete tuple or array sequence when its type parameter is instantiated.
- Instantiation can yield either a bounded tuple or an array-like result, depending on the supplied spread types.
- Function composition is a major use of variadic tuples because parameter lists can be captured and rebuilt with their types intact.
Common mistakes
- Spreading an array whose length is not known produces an unbounded result; subsequent tuple elements become part of that rest portion.
- A rest element is not restricted to the final position, so fixed elements can precede or follow it.
Example: Concatenate tuples with generic spreads
type Arr = readonly unknown[];
function concat<T extends Arr, U extends Arr>(
first: T,
second: U,
): [...T, ...U] {
return [...first, ...second];
}
const result = concat([1, "a"] as const, [true] as const);
// ^? readonly [1, "a"] is accepted as T
// result: [1, "a", true]The generic tuple types preserve each input tuple, while the returned spread types model their concatenation.
When to use it
Flexible parameter lists
Describe APIs with fixed boundary parameters and an arbitrary number of parameters between them.
Function composition
Capture one function's parameters and reconstruct them while composing or transforming functions.
Interview questions
QWhat problem do variadic tuple types solve?
A variadic tuple is a tuple type containing a spread segment, such as [...T, ...U]. Generic spreads allow TypeScript to preserve the concrete tuple types supplied to a function and construct a corresponding output tuple.
Follow-up: How would you type concatenation? Constrain both generics to array types and return [...T, ...U], which models the runtime concatenation.
QHow do generic tuple spreads behave?
They allow tuple spreads to be generic, so a type can represent operations over tuples whose element types are not known when the declaration is written. Instantiating the generics produces concrete tuple or array types.
Follow-up: What happens if a generic spread is an array with unknown length? The resulting type becomes unbounded, and later elements are absorbed into its rest element type.
QWhere may tuple rest elements appear?
Rest elements may appear in the middle of a tuple, enabling signatures with a fixed prefix, a variable segment, and a fixed suffix. This supports APIs whose parameters have known boundary elements but an unknown number of intervening arguments.
Follow-up: Can an unconstrained rest segment preserve later fixed positions? No: if the segment has unknown length, later positions cannot remain separately identifiable in the resulting type.
Related
Tuple TypesRest Elements in Tuple TypesGeneric Rest ParametersFunction Compositionreadonly tuples