Conditional type using infer
Conditional types in TypeScript allow for creating types that depend on a condition. We can leverage the infer keyword within conditional types to extract and manipulate types within conditional type expressions. Let’s see how we can infer tuple types using conditional types.
Syntax:
type TupleType<T> = T extends [infer First, ...infer Rest] ? [First, ...Rest] : never;
Example: To infer the first element of a tuple as tuple type using infer with conditional type.
// Define a conditional type to infer tuple type
type TupleType<T> =
T extends [infer First, ...infer Rest] ? [First, ...Rest] : never;
// Test the conditional type
type MyTuple = TupleType<[number, string, boolean]>;
// MyTuple should be [number, string, boolean]
const myTuple: MyTuple = [10, 'hello', true];
console.log(myTuple);
Output:
[10, "hello", true]
The code leverages the infer keyword within a conditional type to infer tuple types based on certain conditions. It specifies a condition type TupleType, which extracts the type of the first element from a tuple type and shows its application by obtaining a tuple type for a tuple.
How to Infer First Element of a Tuple as a Tuple Type ?
Tuples can be represented as arrays or objects in TypeScript. This will be achieved by knowing Typescript’s type system and methods such as manual inference as well as the use of the advanced type system of TypeScript.
Defining a tuple type in TypeScript resembles the array syntax with the possibility to specify the type for each element position.
Table of Content
- Using TypeScript native tuple support
- Conditional type using infer
- Mapped Types
- Manual Inference to Extract First Element as Tuple Type
Contact Us