How to use TypeScript to point to a function

In TypeScript, creating functions is a fundamental aspect when explaining procedures and maintaining code modularityModularity with functions refers to organizing code into self-contained units that can be easily reused and maintained.. Sometimes, it's necessary to refer to or point to a specific function in TypeScript. We will see the methodology to achieve this without requiring any prior knowledge or information.

Multiple techniques are available for referencing functions, including creating a reference variable. This variable targets a particular function or establishes a type that describes the function's structure and uses it to define variable types.

Function referencing using a variable

We can use function references that enable us to call or invoke the function using the assigned variable, offering convenience in referencing and utilizing functions in TypeScript. It removes the need to rewrite the function definition repeatedly.

Lines 1–3: The greet function accepts a name parameter and logs a greeting message with the provided name.
Lines 4–6: The sayHello variable is assigned as the reference to the greet function. When sayHello is called with the argument "John", it invokes the referenced function and outputs "Hello, John!" to the console. Similarly, it works for "Bob".

Function referencing by specifying function types

This approach helps to define a type that describes the structure of a function and then utilize that type to specify the variable's type.

type MathOperationType = (a: number, b: number) => number;
function add(a: number, b: number): number {
  return a + b;
}
function subtract(a: number, b: number): number {
  return a - b;
}
let operation: MathOperationType;
// Assign the add function to the operation variable
operation = add;
const result = operation(3, 4);
console.log("Result (add):",result); // Output: 7
// Assign the subtract function to the operation variable
operation = subtract;
const result2 = operation(8, 5);
console.log("Result (subtract):",result2); // Output: 3

Line 1: Defines a type called MathOperationType using a function type annotation. It represents a function that takes two number arguments and returns a number.
Lines 3–9: We have a function named add that accepts two number arguments a and b, and returns their sum. Similarly, another function named subtract is declared that takes two number arguments a and b, and returns their difference.
Lines 14–15: A variable named operation of type MathOperationType is declared but not yet assigned a function.Next, the operation variable is assigned the add function, which matches the MathOperationType function signature.
Lines 16–17: The operation variable is invoked with arguments 3 and 4, which calls the assigned add function. The result 7 is stored in the result variable and printed to the console.
Lines 19–21: Continuing the process, the operation variable is now assigned to the subtract function. Subsequently, the function is invoked with the provided arguments, and the resulting values are stored and displayed in the console.

Conclusion

We can point to functions in TypeScript which can be achieved through function references or types, allowing for flexibility and re-usability in code. These approaches enable referencing and invocation of functions based on specific requirements.

Free Resources