Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Showing content from https://www.geeksforgeeks.org/typescript/typescript-functions-type/ below:

TypeScript Functions Type - GeeksforGeeks

Last Updated : 22 Jan, 2025

TypeScript function types define the structure of a function, including its parameter types and return type, ensuring consistent and type-safe usage.

• Help validate the types of parameters passed to a function.
• Ensure the function returns the expected type.
• Improve code clarity and prevent runtime errors.

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

• function: The keyword used to create a function.
• functionName: Name of the function based on its functionality.
• param1, param2: Parameters listed in the function definition.
• type1, type2: Types of the parameters.
• value/expression: The return value, which can be a value or expression.
• returnType: The return type of the function.

There are several types of functions in TypeScript, which are listed below. We will explore these function types along with their basic implementations and examples.

In TypeScript, functions are defined and called by their name. They include types for parameters and return values.

function functionName([args: type]): type { }

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

console.log(add(3, 4));

• Takes two number parameters and returns their sum.
• The return type of the function is explicitly specified as number.

Output:

7

An anonymous function in TypeScript is a function without a specific name, often defined inline, useful for one-off or small tasks where a named function isn't needed. The function call can be made using the variable to which it is assigned.

const variableName = function([args: type]): type { }

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

console.log(subtract(5, 2));

• Declares an unnamed function assigned to subtract.
• The function accepts two numbers and returns their difference.

Output:

3

Arrow functions in TypeScript are concise function expressions using the => syntax. They retain the parent scope's this and are often used for short, simple functions.

const variableName = ([args: type]): type => expression;

const multiply = (a: number, b: number): number => a * b;

console.log(multiply(2, 5));

• Uses the arrow function syntax for simplicity and concise code.
• Multiplies two numbers and returns the result.

Output:

10

Optional parameters in TypeScript allow you to specify function parameters that may be omitted when calling the function. Default parameters provide default values if no argument is passed.

function functionName(arg1: type, arg2?: type): type { }

function greet(firstName: string, lastName: string = "Doe"): string {
    return `Hello, ${firstName} ${lastName}`;
}

console.log(greet("John"));
console.log(greet("Joe", "Smith")); 

• lastName is optional with a default value of "Doe".
• If a value is provided for lastName, it overrides the default.

Output:

Hello, John Doe
Hi, Joe Smith

The return type in TypeScript specifies the data type a function should return. When we expect a function to return a particular type of value like either a string or a number, we can specify return types for functions.

function functionName(parameters: parameterTypes): returnType {
    // Function body
    return value; // Returns a value of 'returnType'
}

Example: Here is the basic example of Return type function in typescript.

function square(num: number): number {
    return num * num;
}

console.log(square(4));

• The square function explicitly defines its return type as number.
• Calculates the square of the input number and returns the result.

Output:

16

In TypeScript, the void return type indicates that a function doesn't return any value. It's often used for functions that perform actions without producing a result.

function functionName(parameters: parameterTypes): void {
    // Function body
    // No 'return' statement or 'return;' is used
}

function logMessage(message: string): void {
    console.log(message);
}

logMessage("Hello, Rahul!");

• The logMessage function performs an action but does not return any value.
• Commonly used for logging or side effects.

Output:

 Hello, Rahul!

Rest parameters in TypeScript allow a function to accept a variable number of arguments of the same type, collecting them into an array for easy processing within the function.

function functionName(...args: type): type { }

function sum(...numbers: number[]): number {
    return numbers.reduce((acc, curr) => acc + curr, 0);
}

console.log(sum(1, 2, 3, 4, 5));

• Collects multiple numeric arguments into an array.
• Uses reduce to calculate the sum of all elements.

Output:

15

Function overloading in TypeScript enables defining multiple function signatures for a single function, allowing it to accept different parameter types or counts while providing type safety.

function functionName(arg1: type, arg2: type): type;
function functionName(arg1: type, arg2: type, arg3: type): type;
function functionName(...args: any[]): any {
    // Implementation
}

function greet(person: string): string;
function greet(person: string, age: number): string;
function greet(person: string, age?: number): string {
    if (age !== undefined) {
        return `Hello, ${person}, you are ${age} years old!`;
    }
    return `Hello, ${person}!`;
}

console.log(greet("Anne"));
console.log(greet("John", 30)); 

• Handles both single and dual-parameter calls.
• Differentiates functionality based on the number of arguments provided.

Output:

Hello, Anne!
Hello, John, you are 30 years old!

A callback function is a function that can be passed as an argument to another function and is executed when a specific event or task is completed. Callbacks are commonly used in asynchronous operations, such as handling the result of a network request or responding to user interactions.

type callBackType = (callBackFunctionName: type) => returnType;

Example: In this example, two number type(a,b) parameters and a callback function(result) is passed to perform Operation function.

function performOperation(a: number, b: number, callback: (result: number) => void): void {
    let result = a + b;
    callback(result);
}

performOperation(3, 4, (result) => {
    console.log(result);
});

• The performOperation function takes two numbers and a callback function as arguments.
• The callback is invoked with the result of adding the two numbers.

Output:

7

• Always Specify Return Types: Clearly define the return type for better readability and error prevention.
• Use Optional and Default Parameters Sparingly: Provide defaults only when it simplifies usage or prevents common errors.
• Prefer Arrow Functions for Callbacks: Use arrow functions for cleaner syntax and to maintain this context.

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4