Explain the arrow function syntax in TypeScript

Last Updated : 11 Sep, 2025

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


Comment

Explore