Jednym z największych atutów TypeScript jest możliwość przypisywania typów do zmiennych i funkcji. Dzięki temu TypeScript może pomóc w uniknięciu błędów, które często występują w dynamicznie typowanym JavaScript. Przypisywanie typów sprawia, że kod staje się bardziej przejrzysty i łatwiejszy w utrzymaniu. W tej części dowiemy się, jak typować zmienne i funkcje w TypeScript.

W TypeScript każda zmienna może mieć przypisany typ. Typ można określić podczas deklaracji zmiennej, co zapewnia, że zmienna będzie przyjmować wartości tylko tego typu. Składnia jest prosta:

let nazwaZmienna: typ = wartość;

Przykłady:

let age: number = 30; // Zmienna typu liczbowego 
let username: string = "Jan Kowalski"; // Zmienna typu string 
let isActive: boolean = true; // Zmienna typu boolean

Jeśli spróbujemy przypisać nieprawidłowy typ do zmiennej, TypeScript zwróci błąd:

age = "trzydzieści"; // Błąd! "trzydzieści" nie jest liczbą

Jeśli nie określimy typu jawnie, TypeScript automatycznie przypisze typ na podstawie wartości przypisanej w momencie deklaracji.

let city = "Warszawa"; // TypeScript automatycznie przypisuje typ string 
let year = 2024; // TypeScript przypisuje typ number

Funkcje w TypeScript również mogą być typowane. Typowanie funkcji oznacza przypisanie typów do parametrów oraz do wartości zwracanej przez funkcję. To pomaga uniknąć błędów, które mogą wynikać z niewłaściwego użycia funkcji.

Składnia wygląda następująco:

function nazwaFunkcji(parametr: typ): typZwracany { 
    // ciało funkcji 
}

Przy definiowaniu funkcji możemy określić typy dla każdego z jej parametrów. TypeScript zapewnia, że tylko wartości zgodne z tymi typami będą mogły być przekazane do funkcji.

Przykład:

function greet(name: string): string { 
    return `Witaj, ${name}!`; 
}

• Parametr name jest typu string, więc można przekazać tylko ciąg tekstowy.
• Funkcja zwraca wartość typu string.

Jeśli spróbujemy przekazać wartość innego typu, TypeScript zgłosi błąd:

greet(123); // Błąd! 123 nie jest ciągiem znaków.

Oprócz typowania parametrów, możemy również określić, jakiego typu wartość funkcja powinna zwrócić. Jeśli funkcja zwróci wartość innego typu, TypeScript zgłosi błąd.

Przykład:

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

TypeScript pilnuje, by funkcja nie zwracała wartości innego typu:

function incorrectAdd(a: number, b: number): number { 
    return a + b + "3"; // Błąd! Zwracany wynik jest typu string, nie number. 
}

Jeśli funkcja nie zwraca żadnej wartości, możemy określić typ zwracany jako void. Jest to szczególnie przydatne w funkcjach, które służą tylko do wykonania pewnych działań, jak np. wypisanie czegoś w konsoli.

Przykład:

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

W TypeScript możemy również określić parametry opcjonalne za pomocą ?. Oznacza to, że parametr nie musi być przekazany do funkcji.

Przykład:

function greetWithAge(name: string, age?: number): string {
    if (age) {
        return `Witaj, ${name}. Masz ${age} lat.`;
    }
    return `Witaj, ${name}!`;
}

W TypeScript możemy również używać typów złożonych, takich jak union (typów tych używamy przy wykorzystaniu pionowej kreski (|) a pozwalają na łączenie dwóch lub więcej typów w jedną definicję) czy typy generyczne, do typowania funkcji.

Na przykład, jeśli chcesz, by parametr funkcji mógł być liczbą lub łańcuchem znaków, użyjesz operatora pionowej kreski |:

function printValue(value: string | number): void {
    console.log(value);
}

Typy złożone zostaną omówione w kolejnych częściach serii, ale warto wiedzieć, że mogą one jeszcze bardziej zwiększyć elastyczność funkcji w TypeScript.

Typowanie zmiennych i funkcji w TypeScript jest kluczowym elementem, który podnosi jakość i bezpieczeństwo kodu. Dzięki precyzyjnemu określeniu typów zmiennych oraz parametrów funkcji możemy uniknąć wielu potencjalnych błędów, które mogą wystąpić w trakcie działania programu.

Typowanie funkcji obejmuje zarówno parametry, jak i wartości zwracane, a TypeScript zapewnia, że typy te są zgodne z deklaracjami.