100 lines
4.7 KiB
TeX
100 lines
4.7 KiB
TeX
\section{Alaptípusok}
|
|
|
|
\begin{frame}[fragile]{Primitív típusok}
|
|
\footnotesize
|
|
A TypeScript primitív típusai megegyeznek a JavaScript primitív értékeivel -- csak most a fordító is számon tartja, melyik változó melyik típusú.
|
|
|
|
\begin{lstlisting}[language=JavaScript,style=NodeJS]
|
|
let name: string = 'Anna';
|
|
let age: number = 25;
|
|
let isActive: boolean = true;
|
|
let id: bigint = 123n;
|
|
let nothing: null = null;
|
|
let notSet: undefined = undefined;
|
|
\end{lstlisting}
|
|
|
|
\begin{itemize}
|
|
\item \texttt{string}, \texttt{number}, \texttt{boolean} -- a leggyakrabban használt három típus
|
|
\item \texttt{null} és \texttt{undefined} önálló típusként is léteznek, de gyakrabban más típusokkal együtt (pl. \texttt{string | null}) fordulnak elő
|
|
\item \texttt{bigint} és \texttt{symbol} ritkábban használt, speciális típusok
|
|
\end{itemize}
|
|
\end{frame}
|
|
|
|
\begin{frame}[fragile]{Tömbök és tuple-ök}
|
|
\footnotesize
|
|
A tömböknél meg kell adni, milyen típusú elemeket tartalmaznak. A \textbf{tuple} egy speciális, rögzített hosszúságú és típussorrendű tömb.
|
|
|
|
\begin{lstlisting}[language=JavaScript,style=NodeJS]
|
|
let names: string[] = ['Anna', 'Bela'];
|
|
let scores: Array<number> = [10, 20, 30];
|
|
|
|
// Tuple: pontosan ket elem, elore rogzitett tipussal
|
|
let point: [number, number] = [3, 5];
|
|
let entry: [string, number] = ['age', 25];
|
|
\end{lstlisting}
|
|
|
|
\begin{block}{Miért hasznos a tuple?}
|
|
Egy \texttt{[string, number]} tuple azonnal jelzi, hogy pontosan két elemet várunk, meghatározott sorrendben -- ellentétben egy sima \texttt{(string | number)[]} tömbbel, ami bármilyen hosszú és sorrendű keveréket engedne.
|
|
\end{block}
|
|
\end{frame}
|
|
|
|
\begin{frame}[fragile]{\texttt{any}, \texttt{unknown} és \texttt{never}}
|
|
\footnotesize
|
|
Három speciális típus, amit érdemes megkülönböztetni -- könnyű összekeverni őket, de nagyon más a szerepük.
|
|
|
|
\begin{itemize}
|
|
\item \textbf{\texttt{any}:} teljesen kikapcsolja a típusellenőrzést erre a változóra -- gyakorlatilag "visszatérünk sima JavaScript-hez". Kerülendő, csak végső esetben használjuk!
|
|
\item \textbf{\texttt{unknown}:} szintén "bármi lehet", de \emph{használat előtt} típusellenőrzést (narrowing) kényszerít ki -- ez a biztonságos alternatívája az \texttt{any}-nek
|
|
\item \textbf{\texttt{never}:} olyan érték típusa, ami \emph{sosem} fordulhat elő -- pl. egy függvény, ami mindig hibát dob, vagy egy végtelen ciklus visszatérési típusa
|
|
\end{itemize}
|
|
|
|
\begin{alertblock}{Ökölszabály}
|
|
Ha típust nem tudsz vagy nem akarsz megadni, használj \texttt{unknown}-t \texttt{any} helyett -- így a fordító legalább kikényszeríti, hogy ellenőrizd az értéket, mielőtt használnád.
|
|
\end{alertblock}
|
|
\end{frame}
|
|
|
|
\begin{frame}[fragile]{Type inference -- amikor nem kell kiírni a típust}
|
|
\footnotesize
|
|
A TypeScript sok esetben \emph{magától kikövetkezteti} (infer) a típust a kezdőértékből -- nem kell mindenhol explicit típust írnunk.
|
|
|
|
\begin{lstlisting}[language=JavaScript,style=NodeJS]
|
|
let name = 'Anna'; // TypeScript tudja: ez string
|
|
let age = 25; // TypeScript tudja: ez number
|
|
|
|
name = 42; // Hiba! nem lehet number-t string-nek adni
|
|
\end{lstlisting}
|
|
|
|
\begin{block}{Mikor írjunk mégis explicit típust?}
|
|
Függvényparamétereknél szinte mindig érdemes (a fordító nem tudja kitalálni, mit fogunk hívni), de egyszerű, azonnal értékadott lokális változóknál nyugodtan hagyatkozhatunk az inferálásra.
|
|
\end{block}
|
|
\end{frame}
|
|
|
|
\begin{frame}[fragile]{Type alias -- saját név egy típusnak}
|
|
\footnotesize
|
|
A \texttt{type} kulcsszóval nevet adhatunk egy típusnak -- ez különösen hasznos, ha egy összetettebb típust (pl. union típust, amit a 4. fejezetben veszünk) többször is használunk.
|
|
|
|
\begin{lstlisting}[language=JavaScript,style=NodeJS]
|
|
type UserId = number;
|
|
type Username = string;
|
|
|
|
function getUser(id: UserId): Username {
|
|
return 'Anna';
|
|
}
|
|
\end{lstlisting}
|
|
|
|
Ez még nem sokkal több, mint egy elnevezés -- de amint a következő fejezetekben összetettebb típusokat (union, interfész) ismerünk meg, a \texttt{type} igazán hasznossá válik.
|
|
\end{frame}
|
|
|
|
\begin{frame}{Összefoglalás -- Alaptípusok}
|
|
\footnotesize
|
|
\begin{block}{Alaptípusok}
|
|
\begin{itemize}
|
|
\item Primitívek: \texttt{string}, \texttt{number}, \texttt{boolean}, \texttt{null}, \texttt{undefined}, \texttt{bigint}
|
|
\item Tömbök: \texttt{string[]}; Tuple: rögzített hosszú/sorrendű tömb, pl. \texttt{[string, number]}
|
|
\item \texttt{any} (kerülendő) vs \texttt{unknown} (biztonságos) vs \texttt{never} (sosem előforduló érték)
|
|
\item Type inference: a fordító sokszor magától kitalálja a típust
|
|
\item \texttt{type} -- nevet adhatunk egy típusnak, újrafelhasználhatóvá téve azt
|
|
\end{itemize}
|
|
\end{block}
|
|
\end{frame}
|