Articles
Введение в TypeScript
Функции в TypeScript

Функции в TypeScript

В этой статье объясняются функции в TypeScript.

YouTube Video

Функции в TypeScript

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

Основное определение функций 

1function add(x: number, y: number): number {
2    return x + y;
3}
4
5console.log(add(5, 10));  // 15
  • Функция add принимает два аргумента типа number и возвращает значение типа number.
  • Она принимает два аргумента, x и y, оба типа number, с явно указанными типами.
  • Тип возвращаемого значения также указан как : number.

Анонимные функции (функциональные выражения)

Анонимные функции и функциональные выражения также можно использовать в TypeScript. Типы могут быть аннотированы аналогичным образом.

1const multiply = function (x: number, y: number): number {
2    return x * y;
3};
4
5console.log(multiply(3, 4));  // 12
  • Вы можете присвоить анонимную функцию переменной и вызвать её позже.
1const factorial = function fact(n: number): number {
2  if (n <= 1) return 1;
3  return n * fact(n - 1); // Can call itself recursively
4};
5
6console.log(factorial(5)); // 120
  • Вы можете использовать именованное функциональное выражение для рекурсивных вызовов.

Функции-стрелки

Аннотации типов также можно использовать с функциями-стрелками.

1const subtract = (x: number, y: number): number => {
2    return x - y;
3};
4
5console.log(subtract(10, 4));  // 6

Этот код определяет стрелочную функцию subtract с аннотациями типа, которая принимает два числа в качестве аргументов и возвращает их разность.

Необязательные и параметры по умолчанию

Параметры могут быть сделаны необязательными или иметь значения по умолчанию.

Необязательные параметры

Добавление ? после имени параметра делает его необязательным.

1function greet(name?: string): string {
2    return name ? `Hello, ${name}` : "Hello!";
3}
4
5console.log(greet());        // Hello!
6console.log(greet("Alice"));  // Hello, Alice

Этот код принимает необязательный аргумент; если аргумент указан, приветствует по имени, иначе возвращает общее приветствие.

Параметры по умолчанию

Вы также можете задать параметры значения по умолчанию.

1function greetWithDefault(name: string = "Guest"): string {
2    return `Hello, ${name}`;
3}
4
5console.log(greetWithDefault());         // Hello, Guest
6console.log(greetWithDefault("Bob"));    // Hello, Bob

Эта функция использует "Гость" в качестве значения по умолчанию, если аргумент не передан, и приветствует, используя указанное или стандартное имя.

Определение типа функции

Также можно определить тип самой функции. Например, это используется при передаче функции в качестве аргумента.

1type Operation = (x: number, y: number) => number;
2
3const addOperation: Operation = (x, y) => x + y;
4const multiplyOperation: Operation = (x, y) => x * y;
5
6console.log(addOperation(2, 3));      // 5
7console.log(multiplyOperation(2, 3)); // 6

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

Когда нет возвращаемого значения (тип void)

Для функций без возвращаемого значения укажите тип void.

1function logMessage(message: string): void {
2    console.log(message);
3}
4
5logMessage("This is a message.");  // This is a message.

Этот код определяет функцию void logMessage, которая принимает строковое сообщение и выводит его в консоль, не возвращая значения.

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

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

1function processData(callback: (data: string) => void): void {
2    const data: string = "Processed Data";
3    callback(data);
4}
5
6processData((result: string): void => {
7    console.log(result);
8});

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

В качестве альтернативы вы можете определить тип функции обратного вызова с помощью type или interface.

 1type Callback = (data: string) => void;
 2
 3function processData(callback: Callback): void {
 4    const data: string = "Processed Data";
 5    callback(data);
 6}
 7
 8processData((result: string): void => {
 9    console.log(result);
10});

Определение типа функции обратного вызова с помощью type или interface повышает её переиспользуемость.

Перегрузка функций

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

 1// Overload Signature
 2function double(value: number): number;
 3function double(value: string): string;
 4
 5// Implementation Signature
 6function double(value: number | string): number | string {
 7    if (typeof value === "number") {
 8        return value * 2;
 9    } else if (typeof value === "string") {
10        return value + value;
11    }
12}
13
14console.log(double(10));      // 20
15console.log(double("Hello")); // HelloHello

В TypeScript перегрузка реализуется следующим образом:.

  • Сигнатура перегрузки

    • Определяет, как может использоваться функция (ее сигнатура). Путем многократного указания этой сигнатуры становится возможной перегрузка.

  • Сигнатура реализации

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

Правила перегрузки

К перегрузке функций применяются следующие правила:.

  • Порядок определения сигнатур перегрузки

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

  • Совместимость сигнатуры реализации

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

  • Укажите детали в сигнатурах перегрузки

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

Резюме

Функции в TypeScript имеют следующие характеристики.

  • Аннотации типов
    • Указывая типы для аргументов и возвращаемых значений, вы можете писать более безопасный код.
  • Анонимные функции и стрелочные функции
    • Их можно использовать так же, как и в JavaScript, а добавление аннотаций типов повышает безопасность типов.
  • Необязательные и параметры по умолчанию
    • Вы можете сделать спецификацию аргументов более гибкой при необходимости.
  • Определения типов функций
    • Определите тип самой функции для выполнения проверки типов.
  • Перегрузка функций
    • Вы можете поддерживать различные аргументы с одним и тем же именем функции.

Используя это, вы можете писать более понятный и надежный код на TypeScript.

Вы можете следовать этой статье, используя Visual Studio Code на нашем YouTube-канале. Пожалуйста, также посмотрите наш YouTube-канал.

YouTube Video

Встроенные функции в TypeScriptЗамыкания в TypeScript