TypeScript Anonymous Functions

🎓 Top 15 Udemy Courses (80-90% Discount): My Udemy Courses - Ramesh Fadatare — All my Udemy courses are real-time and project oriented courses.

▶️ Subscribe to My YouTube Channel (178K+ subscribers): Java Guides on YouTube

▶️ For AI, ChatGPT, Web, Tech, and Generative AI, subscribe to another channel: Ramesh Fadatare on YouTube

Introduction

In this chapter, we will learn anonymous functions in TypeScript. Anonymous functions are defined without a name and are often used as arguments to other functions or assigned to variables. Understanding how to use anonymous functions is essential for writing flexible and concise TypeScript code.

Definition
Anonymous Function Syntax
Basic Anonymous Function
Anonymous Functions as Arguments
Anonymous Functions with Arrow Functions
Using Anonymous Functions in Array Methods
Complete Example with Output
Conclusion

Definition

An anonymous function is defined without a name. It is typically used in places where a named function is not necessary, such as callbacks, event handlers, or immediately invoked function expressions (IIFEs).

Anonymous Function Syntax

Syntax

let functionName = function(parameters: type): returnType {
  // code to be executed
};

Example

This example demonstrates a basic anonymous function assigned to a variable.

let add = function(a: number, b: number): number {
  return a + b;
};

console.log(add(5, 3)); // Output: 8

Output

Basic Anonymous Function

Anonymous functions can be assigned to variables and used like named functions.

Example

This example demonstrates an anonymous function that subtracts two numbers.

let subtract = function(a: number, b: number): number {
  return a - b;
};

console.log(subtract(10, 3)); // Output: 7

Output

Anonymous Functions as Arguments

Anonymous functions are often used as arguments to other functions, such as in callbacks or event handlers.

Example

This example demonstrates using an anonymous function as a callback to the setTimeout function.

setTimeout(function() {
  console.log("This message is displayed after 1 second.");
}, 1000);

Output

This message is displayed after 1 second.

Anonymous Functions with Arrow Functions

Arrow functions provide a more concise syntax for writing anonymous functions.

Example

This example demonstrates using an arrow function to multiply two numbers.

let multiply = (a: number, b: number): number => {
  return a * b;
};

console.log(multiply(4, 5)); // Output: 20

Output

Using Anonymous Functions in Array Methods

Anonymous functions are commonly used in array methods like map, filter, and reduce.

Example

This example uses an anonymous function with the map method to double the values in an array.

let numbers: number[] = [1, 2, 3, 4, 5];
let doubled = numbers.map(function(n: number): number {
  return n * 2;
});

console.log(doubled); // Output: [2, 4, 6, 8, 10]

Output

[2, 4, 6, 8, 10]

Complete Example with Output

In this section, we will combine the examples into a single TypeScript file, compile it to JavaScript, and run it to see the output.

TypeScript Code

You can test the following code in the TypeScript Playground.

// Basic Anonymous Function
let add = function(a: number, b: number): number {
  return a + b;
};
console.log(add(5, 3)); // Output: 8

// Anonymous Function to Subtract
let subtract = function(a: number, b: number): number {
  return a - b;
};
console.log(subtract(10, 3)); // Output: 7

// Anonymous Function as Argument
setTimeout(function() {
  console.log("This message is displayed after 1 second.");
}, 1000);

// Anonymous Function with Arrow Function
let multiply = (a: number, b: number): number => {
  return a * b;
};
console.log(multiply(4, 5)); // Output: 20

// Using Anonymous Functions in Array Methods
let numbers: number[] = [1, 2, 3, 4, 5];
let doubled = numbers.map(function(n: number): number {
  return n * 2;
});
console.log(doubled); // Output: [2, 4, 6, 8, 10]

Conclusion

In this chapter, we covered anonymous functions in TypeScript, including their syntax, usage as arguments, use with arrow functions, and application in array methods. We provided a complete example with its output to illustrate how anonymous functions work in TypeScript. Understanding anonymous functions is essential for writing flexible and concise TypeScript code.

My Top and Bestseller Udemy Courses. The sale is going on with a 70 - 80% discount. The discount coupon has been added to each course below: