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

В этом уроке разберем, как сделать параметр необязательным, нужно ли что-то делать со значением переменной по умолчанию, и как выводить тип возвращаемого значения.

Обязательный параметр

Определим функцию и укажем тип входного параметра:

function getGreetingPhrase(name: string) {
  return `Hello, ${name.toUpperCase()}!`;
}

При таком указании параметр будет обязательным. Если вызвать функцию без параметра, это приведет к ошибке компиляции:

// Expected 1 arguments, but got 0.
getGreetingPhrase();

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

Чтобы сделать параметр необязательным, нужно добавить знак ? после имени переменной:

function getGreetingPhrase(name?: string) {
  return `Hello, ${name ? name.toUpperCase() : "Guest"}!`;
}

getGreetingPhrase("Mike"); // Hello, MIKE!
getGreetingPhrase(); // Hello, Guest!

В таком случае тип переменной name становится составным (Union Type). Другими словами, string | undefined — строка или undefined.

Необязательный параметр может быть undefined, но не null. Чтобы добавить null, нужно изменить определение так:

function getGreetingPhrase(name?: string | null) {
  return `Hello, ${name ? name.toUpperCase() : "Guest"}!`;
}

Здесь мы расширили определение типа переменной name до string | undefined | null.

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

Со значением по умолчанию не нужно ничего указывать дополнительно. Значение задается как в JavaScript. Сама переменная автоматически становится необязательной, и тип выводится, исходя из переданного значения:

function getGreetingPhrase(name = "Guest") {
  return `Hello, ${name.toUpperCase()}!`;
}

getGreetingPhrase(); // Hello, GUEST!

Тип возвращаемого значения

Во многих случаях TypeScript выводит тип возвращаемого значения самостоятельно, но его можно указывать явно:

function getGreetingPhrase(name: string): string {
  return `Hello, ${name.toUpperCase()}!`;
}

Возвращаемый тип может выводиться, но иногда из этого получается не то, что мы ожидаем. Поэтому мы рекомендуем всегда проставлять тип. Это упрощает документирование и защищает код от случайных изменений.

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

Реализуйте функцию getHiddenCard(). Она принимает на вход номер кредитки, который состоит из 16 цифр, в виде строки и возвращает его скрытую версию. Эта версия может использоваться на сайте для отображения. Например, если номер исходной карты был 2034399002125581, то скрытая версия выглядит так: ****5581.

Получается, функция заменяет первые 12 символов на звездочки. Количество звездочек регулируется вторым необязательным параметром. Значение по умолчанию — 4.

// Кредитка передается внутрь как строка
getHiddenCard("1234567812345678", 2); // "**5678"
getHiddenCard("1234567812345678", 3); // "***5678"
getHiddenCard("1234567812345678"); // "****5678"
getHiddenCard("2034399002121100", 1); // "*1100"