89 lines
3.7 KiB
TeX
89 lines
3.7 KiB
TeX
\section{Függvények}
|
|
|
|
\begin{frame}[fragile]{Függvények típusozása}
|
|
\footnotesize
|
|
Egy TypeScript függvénynél mind a paraméterek, mind a visszatérési érték típusát megadhatjuk -- a visszatérési típust a fordító a legtöbbször ki is következteti, de explicit kiírva olvashatóbb, és véd az elgépelés ellen.
|
|
|
|
\begin{lstlisting}[language=JavaScript,style=NodeJS]
|
|
function multiply(a: number, b: number): number {
|
|
return a * b;
|
|
}
|
|
|
|
// Nincs visszatero ertek -> void
|
|
function logMessage(message: string): void {
|
|
console.log(message);
|
|
}
|
|
\end{lstlisting}
|
|
|
|
\begin{block}{Miért érdemes kiírni a visszatérési típust?}
|
|
Ha véletlenül rossz típusú értéket adnánk vissza (pl. \texttt{string}-et \texttt{number} helyett), a fordító azonnal jelezné a hibát -- még mielőtt bárhol meghívnánk a függvényt.
|
|
\end{block}
|
|
\end{frame}
|
|
|
|
\begin{frame}[fragile]{Opcionális és alapértelmezett paraméterek}
|
|
\footnotesize
|
|
Nem minden paraméter kötelező -- a JavaScript-hez hasonlóan itt is megadhatunk alapértelmezett értéket, vagy jelölhetjük egy paramétert opcionálisként.
|
|
|
|
\begin{lstlisting}[language=JavaScript,style=NodeJS]
|
|
function greet(name: string, greeting: string = 'Szia'): string {
|
|
return `${greeting}, ${name}!`;
|
|
}
|
|
|
|
function createUser(name: string, nickname?: string) {
|
|
return { name, nickname: nickname ?? name };
|
|
}
|
|
|
|
greet('Anna'); // "Szia, Anna!"
|
|
greet('Anna', 'Hello'); // "Hello, Anna!"
|
|
\end{lstlisting}
|
|
|
|
\begin{alertblock}{Fontos sorrend}
|
|
Az opcionális (\texttt{?}) és alapértelmezett paraméterek csak a kötelező paraméterek \emph{után} szerepelhetnek a paraméterlistában.
|
|
\end{alertblock}
|
|
\end{frame}
|
|
|
|
\begin{frame}[fragile]{Függvénytípusok -- callback-ek típusozása}
|
|
\footnotesize
|
|
Amikor egy függvény egy másik függvényt vár paraméterként (pl. egy callback-et), magának a "függvény alaknak" is megadhatjuk a típusát.
|
|
|
|
\begin{lstlisting}[language=JavaScript,style=NodeJS]
|
|
type MathOperation = (a: number, b: number) => number;
|
|
|
|
function calculate(a: number, b: number, op: MathOperation): number {
|
|
return op(a, b);
|
|
}
|
|
|
|
const sum: MathOperation = (a, b) => a + b;
|
|
calculate(2, 3, sum); // 5
|
|
\end{lstlisting}
|
|
|
|
Ez különösen hasznos Express.js-ben: egy route handler is pontosan egy ilyen "függvény alakú" típus (\texttt{(req, res) => void}).
|
|
\end{frame}
|
|
|
|
\begin{frame}{Function overloads -- röviden}
|
|
\footnotesize
|
|
Néha egy függvény többféle paraméter-kombinációval is hívható, és a visszatérési típus a bemenettől függ. Erre valók a \textbf{overloads}: több szignatúra deklarálása egyetlen implementáció előtt.
|
|
|
|
\begin{itemize}
|
|
\item Több "fejlécet" (szignatúrát) írunk le, majd egyetlen tényleges implementációt
|
|
\item A hívó fél oldaláról úgy tűnik, mintha több, különböző típusú változata lenne a függvénynek
|
|
\item Ritkán szükséges kezdőként -- inkább unió típusokkal (következő fejezet) old meg a legtöbb esetet
|
|
\end{itemize}
|
|
|
|
\begin{block}{Gyakorlati tanács}
|
|
Ha csak most ismerkedsz a TypeScript-tel, nem kell aktívan használnod az overloads-ot -- elég felismerni, ha egy könyvtár dokumentációjában találkozol vele.
|
|
\end{block}
|
|
\end{frame}
|
|
|
|
\begin{frame}{Összefoglalás -- Függvények}
|
|
\footnotesize
|
|
\begin{block}{Függvények TypeScript-ben}
|
|
\begin{itemize}
|
|
\item Paraméterek és visszatérési típus típusozása -- \texttt{void}, ha nincs visszatérő érték
|
|
\item Alapértelmezett érték (\texttt{= ...}) és opcionális paraméter (\texttt{?}), mindig a kötelezők után
|
|
\item Függvénytípusok: \texttt{(a: number, b: number) => number} -- callback-ek típusozásához
|
|
\item Overloads: több szignatúra egy implementációhoz -- ritkán szükséges kezdőként
|
|
\end{itemize}
|
|
\end{block}
|
|
\end{frame}
|