Open In App

Explain the arrow function syntax in TypeScript

Last Updated : 11 Sep, 2025
Comments
Improve
Suggest changes
Like Article
Like
Report

Arrow functions in TypeScript are similar to JavaScript (ES6) but allow you to add type annotations for parameters and return values. They provide a concise and type-safe way to define functions.

  • Shorter and clearer syntax compared to traditional functions.
  • Support parameter and return type annotations.
  • Preserve the lexical scope of this, avoiding common context issues.

Syntax

let function_name = (
parameter_1 : data_type,
...
) : return_type => {
...
}

In the above syntax:

  • let: Used to declare the arrow function and assign it to a variable.
  • function_name: The name of the variable holding the arrow function.
  • parameter_1: data_type: Function parameter with its type annotation. Multiple parameters can be separated by commas.
  • ... : Indicates additional parameters may be defined.
  • : return_type: Specifies the type of value the function will return.

Example 1: Returning a String

In this example, we create a function that returns a string. The function takes a name as a parameter and returns it.

JavaScript
let getName = (name: string): string => {
    return name;
};

console.log(getName("GeeksforGeeks"));

Output:

GeeksforGeeks

Example 2: Adding Two Integers

In this example, we create a function to add two integers. The function takes two parameters of type number and returns their sum, also of type number

JavaScript
let addNumbers = (num1: number, num2: number): number => {
    return num1 + num2;
};

console.log(addNumbers(100, 40));  
console.log(addNumbers(150, 30));  
console.log(addNumbers(120, 70));  

Output:

140
180
190

Example 3: Using Multiple Data Types

In this example, we create a function that returns a string composed of three different data types. The function takes a number, a string, and an array of numbers as parameters, and returns a formatted string.

JavaScript
let formatData = (id: number, name: string, values: number[]): string => {
    return `${id} - ${name} - ${values.join(", ")}`;
};

console.log(formatData(1, "ABC", [10, 20, 30]));   
console.log(formatData(2, "APPLE", [50, 20, 30]));
console.log(formatData(3, "MANGO", [70, 90, 80])); 

Output:

1- ABC - 10,20,30
2- APPLE - 50,20,30
3- MANGO - 70,90,80



Explore