The TypeScript Type is used to take the or of a function, and create a new type based on them. It is quite useful when we know that the input of a conforms to a certain type, and we want to replicate that. Parameters parameters arguments Function In this guide, let's look at how the utility type works. Parameters TypeScript Custom Types This guide covers custom types. If you're new to custom types, . read my guide on custom types here How the Parameters Type Works Imagine you have a function, with a set number of arguments. For example, here is a TypeScript function with two parameters or arguments, , and : a b const myFunction = (a: string, b: string) => {
    return a + b;
} Let's say we want to run this function. One way is to pass in an array with a , the operator. For example: tuple type three dots const myFunction = (a: string, b: string) => {
    return a + b;
}

let passArray:[string, string] = [ 'hello ', 'world' ]

// Returns 'hello world'
myFunction(...passArray); Here, we define a tuple, which is simply , which we can pass into myFunction, satisfying both the and arguments. [string, string] a b That works fine, but what if the arguments for change? This is especially likely to happen if is coming from a third-party script. Then, we would have to not only update our function but remember to update our tuple type which we pass in. We'd also need to stay up to date with the package is in, in case it changes. myFunction myFunction myFunction Instead, if we want to ensure they always match, we can use to produce the same type. This will create a tuple type of the arguments instead of us having to define it manually: Parameters type myType = Parameters<typeof myFunction>
// Equivalent to a tuple type of:
// type myType = [ a: string, b: string ] This saves us some hassle in defining custom types since we can now pass anything of type into with little fear of error: myType myFunction const myFunction = (a: string, b: string) => {
    return a + b;
}

type myType = Parameters<typeof myFunction>

let myArray:myType = [ 'hello ', 'world' ];

myFunction(...myArray) Typing Specific Parameters with the Parameter Utility Type Parameter types are also quite flexible, and allow us to define more than just the full set of arguments. For example, if we wanted to only match the type of the first argument in our function , we can reference that like a simple array, by adding . The following will match the type of , but if we wanted to match the type of , we could use : myFunction [0] a b [1] type myType = Parameters<typeof myFunction>[0]
// Equivalent of 'string' That way, we could define custom types for each argument if we have to in our code. For example, here we define two custom types for the first and second parameters of the function, and pass them both into our function: const myFunction = (a: string, b: string) => {
    return a + b;
}

type aType = Parameters<typeof myFunction>[0]
type bType = Parameters<typeof myFunction>[1]

let a:aType = 'hello '
let b:bType = 'world'

myFunction(a, b) More fun with Parameters Since converts the type of arguments to a new type, we can also pass a function directly into it. The below will produce a type . This is less useful than taking the parameters from a specific function, but can serve purposes in certain situations: Parameters [ a: string, b: number ] type anotherType = Parameters<(a: string, b: number) => void>

2022 - HackerNoon Contributor of the Year - Coding

2022 - HackerNoon Contributor of the Year - Coding Skills

2022 - HackerNoon Contributor of the Year - Java

2022 - HackerNoon Contributor of the Year - Javascript

2022 - HackerNoon Contributor of the Year - Website Development

2022 - Tip Your Hat Tutorials Best Tutorials

Coding Guru of 2022

Nominated for 2022 - HackerNoon Contributor of the Year - Javascript

Nominated for 2022 - HackerNoon Contributor of the Year - Coding

Nominated for 2022 - HackerNoon Contributor of the Year - Coding Skills

Nominated for 2022 - Tip Your Hat Tutorials Best Tutorials

Nominated for 2022 - HackerNoon Contributor of the Year - Java

Nominated for 2022 - HackerNoon Contributor of the Year - Website Development

Nominated for Coding Guru of 2022

Nominated for 2022 - HackerNoon Contributor of the Year - Typescript

Too Long; Didn't Read

Get free API security automated scan in minutes

A Guide on How TypeScript Parameters Type Works

A Guide on How TypeScript Parameters Type Works

Too Long; Didn't Read

@smpnjn

RELATED STORIES