Подробно про функции и типы в TypeScript

В этом руководстве вы узнаете о функциях TypeScript и о том, как использовать аннотации типов для обеспечения проверки типов для функций.

Введение в функции TypeScript

Функции TypeScript являются строительными блоками читаемого, поддерживаемого и многократно используемого кода.

Как и в JavaScript, используется ключевое слово function для объявления функции в TypeScript:

function name(parameter: type, parameter:type,...): returnType {
   // do something
}

В отличие от JavaScript, TypeScript позволяет использовать аннотации типов в параметрах и возвращаемых значениях функции.

Давайте посмотрим на следующий пример функции add() :

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

В этом примере функция add() принимает два параметра с типом number.

Когда вы вызываете функцию add(), компилятор TypeScript проверяет каждый переданный функции аргумент, чтобы убедиться, что это числа.

В примере с функцией add() в нее можно передавать только числа, а не значения других типов.

Следующий код приведет к ошибке, поскольку он передает две строки вместо двух чисел в функцию add() :

let sum = add('10', '20');

Ошибка:

error TS2345: Argument of type '"10"' is not assignable to parameter of type 'number'

Типы параметров функции также доступны в теле функции для проверки типов.

: number после круглых скобок указывает тип возвращаемого значения. В этом случае функция add() возвращает значение типа number.

Когда функция имеет возвращаемый тип, компилятор TypeScript проверяет каждую инструкцию return на соответствие возвращаемому типу, чтобы убедиться, что возвращаемое значение совместимо с ним.

Если функция не возвращает значение, вы можете использовать тип void в качестве возвращаемого типа. Ключевое слово void указывает, что функция не возвращает никакого значения. Например:

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

void запрещает коду внутри функции возвращать значение и запрещает вызывающему коду присваивать результат функции переменной.

Если вы не аннотируете возвращаемый тип, TypeScript попытается вывести соответствующий тип. Например:

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

В этом примере компилятор TypeScript пытается вывести возвращаемый тип функции add() в тип number, что и ожидалось.

Однако если функция имеет разные ветви, которые возвращают разные типы, компилятор TypeScript может определить тип union или тип any.

Поэтому важно как можно больше добавлять аннотаций типов к функции.

• Используйте аннотации типа для параметров функции и типа возвращаемого значения, чтобы сохранить встроенный код вызова и обеспечить проверку типа в теле функции.

Тип функции в TypeScript

Тип функции состоит из двух частей: параметры и возвращаемый тип. При объявлении типа функции вам необходимо указать обе части со следующим синтаксисом:

(parameter: type, parameter:type,...) => type

В следующем примере показано, как объявить переменную с типом функции, которая принимает два числа и возвращает число:

let add:(x: number, y: number) => number;

В этом примере:

• Тип функции принимает два аргумента: x и y с типом number.
• Тип возвращаемого значения — number, который следует за толстой стрелкой( => ), появившейся между параметрами и типом возвращаемого значения.

Обратите внимание, что имена параметров( x и y ) предназначены только для удобства чтения. Пока типы параметров совпадают, это допустимый тип для функции.

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

Компилятор TypeScript сопоставит количество параметров с их типами и типом возвращаемого значения.

В следующем примере показано, как назначить функцию переменной add :

add = function(x: number, y: number) {
    return x + y;
};

Кроме того, вы можете объявить переменную и присвоить ей функцию следующим образом:

let add:(a: number, b: number) => number =
    function(x: number, y: number) {
        return x + y;
    };

Если вы назначите другие функции, тип которых не соответствует переменной add, TypeScript выдаст ошибку:

add = function(x: string, y: string): number {
    return x.concat(y).length;
};

В этом примере мы переназначили функцию, тип которой не соответствует, функциональной переменной add.

Вывод типов функций

Компилятор TypeScript может определить тип функции, когда у вас есть тип на одной стороне уравнения. Эта форма вывода типа называется контекстной типизацией. Например:
В этом примере функция add примет тип (x: number, y:number) => number.

Используя вывод типов, вы можете значительно сократить объем кода с аннотациями.