Modulelessen (1/2)
Getypte functies
Functies zijn de fundamentele bouwstenen van elke JavaScript-toepassing. In TypeScript kunnen we zowel invoerargumenten als retourwaarden nauwkeurig annoteren, waardoor onze interfaces en functieaanroepen extreem veilig en zelfdocumenterend zijn.
Optionele en standaardparameters
In JavaScript is elke parameter optioneel en wordt deze standaard ingesteld op undefined als deze wordt weggelaten. In TypeScript is standaard elke gedeclareerde parameter verplicht.
We kunnen echter optionele parameters definiëren met behulp van het vraagteken (?), of standaardwaarden rechtstreeks in de functiehandtekening opgeven.
1. Optionele parameters
Optionele parameters moeten na alle verplichte parameters worden geplaatst:
function greetUser(name: string, title?: string): string {
if (title) {
return `Good morning ${title} ${name}`;
}
return `Hello ${name}`;
}2. Standaardparameters
Als er geen waarde is opgegeven voor een parameter met een standaardwaarde, leidt TypeScript het type af en wijst de opgegeven standaardwaarde toe:
function greetUserWithDefault(name: string, prefix: string = 'Hello'): string {
return `${prefix} ${name}`;
}Rustparameters (...args)
Als we een variabel aantal argumenten willen accepteren, kunnen we de rest-operator gebruiken. In TypeScript moeten deze parameters als een array worden getypt:
function sumAll(message: string, ...numbers: number[]): string {
const total = numbers.reduce((sum, n) => sum + n, 0);
return `${message} ${total}`;
}Functietypen (oproephandtekeningen)
We kunnen het type van een functie onafhankelijk definiëren en het vervolgens hergebruiken in variabeledeclaraties of callback-argumenten:
// Define function type using type alias
type MathOperation = (a: number, b: number) => number;
const add: MathOperation = (x, y) => x + y;
const multiply: MathOperation = (x, y) => x * y;Deze aanpak is essentieel bij het doorgeven van functies als argumenten aan andere functies (callbacks).
Probeer het zelf
Oefening 1: Optionele parameters
Maak een functie met de naam formatName die een parameter firstName (tekenreeks) en een optionele parameter lastName (tekenreeks) accepteert. Als achternaam is opgegeven, retourneert u 'voornaam achternaam', anders retourneert u alleen 'voornaam'.
Toon hint
Onthoud dat de optionele parameter wordt gedeclareerd met behulp van lastName?: string na de verplichte parameter.
Oplossing beschikbaar na 3 pogingen
Oefening 2: Standaardparameters
Maak een functie met de naam macht die een grondtal (getal) en een exponent (getal met een standaardwaarde van 2) accepteert. De functie moet de waarde berekenen en retourneren van het grondtal verheven tot de exponent (gebruik Math.pow).
Toon hint
Gebruik grondtal: getal en exponent: getal = 2 binnen de functiesignatuur.
Oplossing beschikbaar na 3 pogingen
Oefening 3: Functiehandtekening
Definieer een typealias met de naam BinaryOp die een functie beschrijft die twee getalparameters accepteert en een getal retourneert. Declareer vervolgens een constante benoemde som van het type BinaryOp die optelling implementeert.
Toon hint
De syntaxis voor een functietype is (a: getal, b: getal) => getal.
Oplossing beschikbaar na 3 pogingen
Oefening 4: Terugbelfunctie
Maak een functie met de naam processItems die twee parameters accepteert: items (een array van tekenreeksen) en callback (een functie die een enkele tekenreeks accepteert en niets retourneert, d.w.z. ongeldig). De functie moet een for...of-lus uitvoeren over elk element in items en deze doorgeven aan de callback.
Toon hint
Declareer de handtekening als processItems(items: string[], callback: (item: string) => void): void en gebruik een lus om de callback aan te roepen.
Oplossing beschikbaar na 3 pogingen