Урок 06

Функции

Типизация параметров и возврата

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

Тип возврата можно опустить — TypeScript выведет:

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

Но в публичных функциях лучше указывать явно.

Стрелочные функции

const add = (a: number, b: number): number => a + b;

Функция без возврата

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

Опциональные параметры

function greet(name: string, title?: string): string {
    return title ? `${title} ${name}` : name;
}

greet('Алиса');
greet('Алиса', 'Доктор');

Значения по умолчанию

function greet(name: string, title: string = 'Гость'): string {
    return `${title} ${name}`;
}

Параметры со значением по умолчанию автоматически опциональны.

Rest-параметры

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

sum(1, 2, 3);

Тип функции

Функцию можно описать как тип:

type MathFn = (a: number, b: number) => number;

const add: MathFn = (a, b) => a + b;

Или через интерфейс:

interface MathFn {
    (a: number, b: number): number;
}

Функции как аргументы

function apply(a: number, b: number, fn: (x: number, y: number) => number): number {
    return fn(a, b);
}

apply(2, 3, (x, y) => x + y);

Типы x и y выводятся из контекста.

Callback

type Callback = (result: string) => void;

function process(callback: Callback) {
    callback('готово');
}

Перегрузки

Если функция может принимать разные наборы аргументов:

function format(value: string): string;
function format(value: number): string;
function format(value: string | number): string {
    return String(value);
}

Первые две строки — сигнатуры. Последняя — реализация.

this

function handleClick(this: HTMLButtonElement, event: MouseEvent) {
    console.log(this.textContent);
}

Первый аргумент this — виртуальный, не передаётся при вызове.

Асинхронные функции

async function fetchUser(id: number): Promise<User> {
    const res = await fetch(`/api/users/${id}`);
    return res.json();
}

Возвращаемый тип — Promise<T>.

Итоги

  • Тип параметров и возврата через :
  • ? — опциональный параметр
  • Значение по умолчанию делает параметр опциональным
  • ...rest: T[] — rest-параметры
  • Тип функции — (a: T) => R
  • Перегрузки для разных наборов аргументов
  • Async-функции возвращают Promise<T>