TypeScript Call Signatures

TypeScript Call Signatures within an object type to describe objects that are callable, meaning they can be invoked like functions, but they may also have properties. This is a powerful feature that allows you to create objects that act as both functions and containers for data. These objects are often referred to as “callable objects.”

Syntax:

type MyCallableObject = {
    (parameter1: Type1, parameter2: Type2, ...): ReturnType; // Call signature
    propertyName: PropertyType; // Property
};

Parameters:

• MyCallableObject: This is the name of the object type you are defining. You can replace it with your desired type name.
• ( and ): These parentheses enclose the call signature definition, specifying the parameters and return type of the callable object.
• parameter1, parameter2, …: These are the names of the parameters that the callable object function expects, each followed by a colon and their respective types (e.g., Type1, Type2, …).
• ReturnType: This is the type that the callable object function is expected to return when it is invoked.
• propertyName: This is an example of a property that can be included in the object type. You can have any number of properties in your object type, and each one is followed by a colon and its type (e.g. PropertyType).

Example 1: In this example, We define the object type, which includes a call signature that specifies the callable object should accept one parameter (string) and return a string. It also includes a property named propertyName of type string. We create an object myObject of type objects by implementing the call signature with a function that concatenates the parameters.

Javascript

// Define a callable object type
// with a call signature and a property
type objects = {
    (param: string): string; // Call signature
    propertyName: string; // Property
};
// Create an object of the defined type
const myObject: objects = (param) => {
    return `Received: ${param} `;
};

// Assign a value to the property
myObject.propertyName = "Computer Science Portal";

// Invoke the object as a function
const result = myObject("GeeksforGeeks");

console.log(result);
console.log(myObject.propertyName);

Output:

Example 2: In this example, We define the Calculator type, which includes a call signature for operation(taking two numbers and returning a number) and a property named operation to describe the operation. We create objects of type Calculator, each implementing the call signature with a specific mathematical operation and setting the operation property accordingly.

Javascript

// Define a callable object type
// with a call signature and a property
type Calculator = {
    // Call signature for addition
    (a: number, b: number): number;

    // Property to describe the operation
    operation: string;
};

// Create an object of the defined type
const add: Calculator = (a, b) => a + b;
add.operation = "Addition";

const subtract: Calculator = (a, b) => a - b;
subtract.operation = "Subtraction";

const divide: Calculator = (a, b) => a / b;
divide.operation = "Divide";

const multiply: Calculator = (a, b) => a * b;
multiply.operation = "Multiply";

// Invoke the objects as functions
const sum = add(5, 3);
const difference = subtract(8, 2);
const div = divide(6, 3);
const mul = multiply(4, 4);

console.log(`${add.operation}: ${sum}`);
console.log(`${subtract.operation}: ${difference}`);
console.log(`${divide.operation}: ${div}`);
console.log(`${multiply.operation}: ${mul}`);

Output: