Horje
How to Infer Return Type from a Tuple Parameter ?

In TypeScript, inferring the return type from a tuple parameter involves deriving the type of value returned by a function based on the types of its tuple parameters. This allows the compiler to deduce the function’s output type without explicit annotation, enhancing type safety and readability.

These are the following approaches:

Approach 1: Using Conditional Type

In this approach, we are using a conditional type to infer the return type from a tuple parameter. It deconstructs the tuple, extracting the last element as the return type, ensuring accurate type inference for functions with tuple parameters.

Example: We define myReturnType to infer the return type from a tuple parameter. It applies this to myFunction, then assigns the return value of booleanReturn() to a variable, result, with the inferred type.

JavaScript
type myReturnType<T extends any[]> = 
    T extends [infer First, ...infer Rest, infer Return] ? Return : never;

function myFunction(...args: [number, string, boolean]): string {
    return "GeeksforGeeks";
}

type Result = myReturnType<Parameters<typeof myFunction>>;

function booleanReturn(): boolean {
    return true;
}

// The result type should match the return type of the myFunction which is string.
// So we need to correct the following line accordingly.
const result: string = myFunction();
console.log(result);

Output:

true

Approach 2: Using ReturnType with Function Type

In this approach, we are using ReturnType with function types. It derives the return type from a function’s signature. For instance, ReturnType<typeof func> infers the return type of function func.

Example: We define myFunction returning a tuple of string and number. booleanReturn returns a value matching myFunction’s return type.

JavaScript
function myFunction(...args: [number, string, boolean]): [string, number] {
    return ["GeeksforGeeks", 18];
}

type Result = ReturnType<typeof myFunction>;

function booleanReturn(): Result {
   // Ensure the returned array matches the expected Result type.
    return ["true", 18]; 
    
}

const result: Result = booleanReturn();

console.log(result);

Output:

[ 'true', 18 ]

Approach 3: Using Inference with Tuple Parameter

This approach utilizes TypeScript’s type inference capabilities to deduce the return type from a tuple parameter directly within the function signature. By leveraging the types of the tuple parameters, TypeScript infers the appropriate return type, enhancing code readability and reducing the need for explicit type annotations.

Example: We define a function, extractReturnType, which takes a tuple parameter and returns the last element of the tuple. The return type is directly inferred by TypeScript based on the tuple parameter provided.

JavaScript
function extractReturnType<T extends any[]>(...args: T): T[number] {
    return args[args.length - 1];
}


const result1: string | number | boolean = extractReturnType("Hello", 42, true); 
const result2: number = extractReturnType(1, 2, 3, 4); 

console.log(result1);
console.log(result2);

Output:

true 
4



Reffered: https://www.geeksforgeeks.org


JavaScript

Related
How to Type Dynamic Object with Methods with Dynamic Argument Count ? How to Type Dynamic Object with Methods with Dynamic Argument Count ?
Print all Positive Numbers in JavaScript Array Print all Positive Numbers in JavaScript Array
Print all Negative numbers in a Range in JavaScript Array Print all Negative numbers in a Range in JavaScript Array
How to Sort a Multidimensional Array in JavaScript by Date ? How to Sort a Multidimensional Array in JavaScript by Date ?
How to Iterate over Map Elements in TypeScript ? How to Iterate over Map Elements in TypeScript ?

Type:
Geek
Category:
Coding
Sub Category:
Tutorial
Uploaded by:
Admin
Views:
14