Типізовані функції

Functions are the fundamental building blocks of any JavaScript application. In TypeScript, we can precisely annotate both input arguments and return values, making our interfaces and function calls extremely safe and self-documenting.

Optional and Default Parameters

In JavaScript, every parameter is optional and defaults to undefined if omitted. In TypeScript, by default, every declared parameter is mandatory.

However, we can define optional parameters using the question mark (?), or specify default values directly in the function signature.

1. Optional Parameters

Optional parameters must be positioned after all mandatory parameters:

function greetUser(name: string, title?: string): string {
  if (title) {
    return `Good morning ${title} ${name}`;
  }
  return `Hello ${name}`;
}

2. Default Parameters

If no value is provided for a parameter with a default value, TypeScript infers its type and assigns the specified default:

function greetUserWithDefault(name: string, prefix: string = 'Hello'): string {
  return `${prefix} ${name}`;
}

Rest Parameters (...args)

When we want to accept a variable number of arguments, we can use the rest operator. In TypeScript, these parameters must be typed as an array:

function sumAll(message: string, ...numbers: number[]): string {
  const total = numbers.reduce((sum, n) => sum + n, 0);
  return `${message} ${total}`;
}

Function Types (Call Signatures)

We can define a function's type independently and then reuse it in variable declarations or callback arguments:

// Define function type using type alias
type MathOperation = (a: number, b: number) => number;

const add: MathOperation = (x, y) => x + y;
const multiply: MathOperation = (x, y) => x * y;

This approach is essential when passing functions as arguments to other functions (callbacks).

Try it yourself

Exercise 1: Optional Parameters

Exercise 2: Default Parameters

Exercise 3: Function Signature

Exercise 4: Callback Function