TypeScriptTypy podstawowe

Typy funkcji

Typowanie parametrów, wartości zwracanej i samych funkcji jako wartości.

Na tej stronie

Przykład

#
TypeScript
function formatPrice(amount: number, currency = 'zł', discount?: number): string {
  const final = discount ? amount * (1 - discount) : amount
  return `${final.toFixed(2)} ${currency}`
}

console.log(formatPrice(49))
console.log(formatPrice(100, 'zł', 0.2))
Wynik
49.00 zł
80.00 zł

Definicja i zastosowanie

#

W funkcjach typujesz parametry i, opcjonalnie, wartość zwracaną: function add(a: number, b: number): number. Parametry bez typu przy włączonym strict powodują błąd, bo miałyby niejawny typ any.

Parametry opcjonalne oznaczasz znakiem zapytania (title?: string), a wartości domyślne podajesz jak w JavaScripcie (limit = 10). Kompilator pilnuje też liczby argumentów przy wywołaniu.

Funkcję jako wartość opisuje typ strzałkowy: (value: string) => boolean. Taki typ przydaje się przy funkcjach zwrotnych, obsługach zdarzeń i przekazywaniu funkcji do komponentów.

Składnia

#
Składnia
function nazwa(param: typ, opcjonalny?: typ): typZwracany { … }
type Fn = (param: typ) => typZwracany

Więcej przykładów

#
Typ funkcji jako parametr
TypeScript
type Validator = (value: string) => boolean

const isEmail: Validator = (value) => value.includes('@')
const notEmpty: Validator = (value) => value.trim().length > 0

function validate(value: string, rules: Validator[]): boolean {
  return rules.every((rule) => rule(value))
}

console.log(validate('ania@codeworlds.pl', [notEmpty, isEmail]))
console.log(validate('   ', [notEmpty, isEmail]))
Wynik
true
false

Dobre praktyki

#
  • Typ zwracany warto pisać jawnie w funkcjach eksportowanych. Chroni przed przypadkową zmianą kontraktu.
  • Parametry opcjonalne umieszczaj na końcu listy.

Powiązane hasła

#

Widzisz błąd albo brakuje przykładu? Napisz do nas.