What is the specific term for an event that exclusively passes type arguments into a generic function within the realm of TypeScript?

Question

What is the specific term for an event that exclusively passes type arguments into a generic function within the realm of TypeScript?

Currently delving into the world of typescript generics, I recently crafted a generic function as shown below:


function getRandomElement<T>(items: T[]): T {
    let ranIndex = Math.floor(Math.random() * items.length);
    return items[ranIndex];
}

Curious to see what happens, I purposely invoked the function without passing any arguments, only specifying the type:

let result = getRandomElement<number>;

To my surprise, no error message was flagged by the TypeScript compiler for the declaration of the result variable. Instead, result transformed into a function ((items: number[]) => number). Eager to explore this aspect further, I scoured the web but couldn't find significant information on it.

If you have insights or keywords related to this feature, I would greatly appreciate your input. Thank you for addressing my query!

typescript function generics typescript-generics

Answer 1

Answer №1

getRandomElement<number> stands as an instantiation expression, following the implementation in microsoft/TypeScript#47607 and being introduced in TypeScript 4.7.

In the past, we could manually specify type arguments for a generic function when calling it, like f<X, Y>(a, b, c):

declare const f: <T, U>(x: T, y: U, z: T[]) => [T, U]
// const f: <T, U>(x: T, y: U, z: T[]) => [T, U]    

declare const a: X;
declare const b: Y;
declare const c: X[];
f<X, Y>(a, b, c); // invoking a generic function

However, with instantiation expressions, you can do so without the need to call the function directly, such as using (f<X, Y>)(a, b, c), where f<X, Y> is treated as its own proper expression:

(f<X, Y>)(a, b, c); // calling an instantiation expression

The resulting "non-generic" function (f<X, Y>) can be assigned to its own variable:

const g = (f<X, Y>);
// const g: (x: X, y: Y, z: X[]) => [X, Y]

This function can then be utilized repeatedly with the same type arguments:

g(a, b, c);
declare const d: X;
declare const e: Y;
g(d, e, [a, d]);

Playground link to code

Answer 2

getRandomElement<number> stands as an instantiation expression, following the implementation in microsoft/TypeScript#47607 and being introduced in TypeScript 4.7.

In the past, we could manually specify type arguments for a generic function when calling it, like f<X, Y>(a, b, c):

declare const f: <T, U>(x: T, y: U, z: T[]) => [T, U]
// const f: <T, U>(x: T, y: U, z: T[]) => [T, U]    

declare const a: X;
declare const b: Y;
declare const c: X[];
f<X, Y>(a, b, c); // invoking a generic function

However, with instantiation expressions, you can do so without the need to call the function directly, such as using (f<X, Y>)(a, b, c), where f<X, Y> is treated as its own proper expression:

(f<X, Y>)(a, b, c); // calling an instantiation expression

The resulting "non-generic" function (f<X, Y>) can be assigned to its own variable:

const g = (f<X, Y>);
// const g: (x: X, y: Y, z: X[]) => [X, Y]

This function can then be utilized repeatedly with the same type arguments:

g(a, b, c);
declare const d: X;
declare const e: Y;
g(d, e, [a, d]);

Playground link to code

Answer 3

Answer №2

Interestingly, performing the action in the following line is quite common in numerous programming languages:

let result = getRandomElement<number>;

This practice of assigning a function to a variable is perfectly acceptable in JavaScript/Typescript. Therefore, TypeScript does not raise any objections - you have not made an error as of yet ;-)

It is important to note that you are not actually executing the function... but rather simply storing it in another variable. Consequently, you can directly call the assigned function if desired, like so:

const dummyItems = ["one", "two", "three"];
const assignedFunction = getRandomElement<string>;
const resultOfRunningAssignedFunction = assignedFunction(dummyItems);

The aforementioned code line ( function invocation ) is necessary if you want to observe something happening. Essentially, calling a function is essential to witness any meaningful output or result.

Answer 4

Interestingly, performing the action in the following line is quite common in numerous programming languages:

let result = getRandomElement<number>;

This practice of assigning a function to a variable is perfectly acceptable in JavaScript/Typescript. Therefore, TypeScript does not raise any objections - you have not made an error as of yet ;-)

It is important to note that you are not actually executing the function... but rather simply storing it in another variable. Consequently, you can directly call the assigned function if desired, like so:

const dummyItems = ["one", "two", "three"];
const assignedFunction = getRandomElement<string>;
const resultOfRunningAssignedFunction = assignedFunction(dummyItems);

The aforementioned code line ( function invocation ) is necessary if you want to observe something happening. Essentially, calling a function is essential to witness any meaningful output or result.

What is the specific term for an event that exclusively passes type arguments into a generic function within the realm of TypeScript?

Answer №1

Answer №2

Similar questions

Attempting to create a promise for a dropdown menu in React-Select

What's causing the discrepancy in the parameters?

Pass the variant value from Shopify/Restyle to the child component in a seamless way

The Axios GET method retrieves a response in the form of a string that represents an object

Default exports are not supported in TypeScript

How to empty an array once all its elements have been displayed

The parameter 'NextApiRequest' cannot be assigned to the parameter 'Request'

Issue encountered: Nuxt 3 fails to locate the useRoute import

When attempting to build the iOS app with Ionic, the error "Unable to access property toLowerCase of undefined" is

Validation error from Express-validator may result in TypeScript error: the request.query object could potentially be undefined

The @Prop property decorator in Vue cannot be utilized as it is not compatible

Issue with TypeORM Many-to-Many relation returning incorrect data when using the "where" clause

In C++, a variable can be accessed within a constructor but not in a function

What is the process in Typescript for importing JSON files and dynamically searching for values based on keys?

What steps can I take to troubleshoot and fix the issue of a Duplicate identifier 'DateType' error during the React/Typescript building process

Yelp API call resulting in an 'undefined' response

Understanding and resolving asynchronous issues in jQuery success callback functions

Unraveling the mysteries of an undefined entity

Typedoc does not create documentation for modules that are imported

Is there a way to make a peer dependency optional in a project?