What does <abc<xyz>> after a function name mean in TypeScript?

user_16278772 0
Viewed 182

I'm learning TypeScript. Today I opened a random project on the Internet, and saw this in a TypeScript file:

import { Route, useRoute } from "@react-navigation/native"
import { NewAppointmentConfirmationScreenProps } from "@app/screens/new-appointment-confirmation/types"

export const useNewAppointmentConfirmationScreenRoute = () =>
  useRoute<Route<"NewAppointmentConfirmationScreen", NewAppointmentConfirmationScreenProps>>()

I never seen this function before! What does this:

useRoute<Route<"NewAppointmentConfirmationScreen", NewAppointmentConfirmationScreenProps>>()

mean? I know a component is something like <abc/> but what is a function name followed by angle brackets (less-than/greater-than signs)?

typescript
1 Answers

it is called generics

https://www.typescriptlang.org/docs/handbook/2/generics.html

for more specific info

in short it helps us when we need strong types on classes in a diffrent syntax

a video generics video

i am not sure but i think historically that this is comes from strong types languages and more common in java and c#

for example when we initialize a arrayList in java we need to specify the type of data we store in a triangle brackets like you specify in your example

arrayList

https://www.w3schools.com/java/java_arraylist.asp

do you see the syntax ?

ArrayList<String>

if i am correct than it just for the function parameters types

***edit

i just saw this on a .net5 page

https://docs.microsoft.com/en-us/dotnet/api/system.func-2?view=net-5.0

check it out and play with the runtime online

enter image description here

user_131044900
Related