Funktionsweise Flashcards
Was ist der Abstract Syntax Tree (AST)?
Der Compiler parsed den Quellcode zum Abstract Syntax Tree (AST), indem alle Whitespaces, Kommentare und Indentations entfernt werden.
Der AST wird dann zu Bytecode kompiliert
Der Bytecode wird dann von runtime evaluated.
Welche Vorteile bringt Typescript?
Fehler fallen nicht mehr zu runtime auf, sondern beim Schreiben im Editor
Type Safety vermindert Fehler bei Schnittstellen.
Umdenken im Code schreiben von Value Level hin zum Type Level
Dokumentation wird verbessert
Refactoring & Erweiterbarkeit wird verbessert
Unit Testing wird teilweise überflüssig
Bessere Produktivität
Wie funktioniert das Typechecking durch TypeScript technisch?
Typescript Source -> TypeScript AST
AST wird durch typechecker geprüft
TypeScript AST -> JavaScript Source
Danach
JavaScript Source -> JavaScript AST
AST -> Bytecode
Bytecode Auswertung zu runtime
Wird TypeScript zu JavaScript konvertiert?
Ja, nachdem das der TypeScript AST erzeugt wurde wird dieser typechecked und dann in JavaScript gewandelt.
Was ist ein Typechecker?
Ein Programm, welches den TypeScript AST auf Type Safety überprüft.
Bei Unstimmigkeiten entstehen Fehler.
Was ist Type Safety (Typisierung)?
Die Nutzung von Typen, um ein Programm daran zu hindern ungültige Dinge zu tun.
Welche Dinge in der Kompilierung von TypeScript geschehen durch den TypeScript Compiler (TSC) und welche durch JavaScript runtime?
TypeScript Compiler (TSC)
TypeScript Source -> TypeScript AST
AST typechecking
TypeScript AST -> JavaScript Source
JavaScript runtime
JavaScript Source -> JavaScript AST
AST -> bytecode
Bytecode evaluierung durch runtime
Warum ist es wichtig wann TypeScript das typechecking macht?
Es zuerst und in einem anderen Schritt als die Übersetzung zu JavaScript
Daher kann die Typisierung überarbeitet und verbessert werden während das JavaScript Programm keine breaking Changes ausgesetzt wird.
Was ist ein Type System?
Ein Set an Regeln das der Typechecker nutzt, um Typen für das Programm zu bestimmen
Welche beiden Arten von Type Systems gibt es?
Ein Type System bei welchem dem Compiler alles mit expliziter Syntax gesagt werden muss
Und ein Type System welches die Typen sich selbst erschließt
Welche Art von Type System nutzt TypeScript? Explizit oder Infered?
TypeScript kann durch Annotations explizite Typisierung
Aber auch erschlossene / inferred Typisierung
Muss man in TypeScript explizit hinter einer Variable den Typen schreiben?
let a: number = 1
Nein, auch mit let a = 1 würde TypeScript sich den Typen erschließen / inferring
Wann sollte man Typen mit TypeScript explizit und wann implizit typisieren?
Es ist gutet Stil immer wenn es geht nicht die Typisierung zu schreiben, sondern TypeScript sich diese ableiten lassen (inferring)
Dadurch wird der explizite Code und der Quellcode minimiert
Wie sind Typen in JavaScript vs Typescript gebunden?
JavaScript = dynamische Bindung
TypeScript = statische Bindung
Wie werden Typen in JavaScript und in TypeScript konvertiert?
JavaScript = Automatische Konvertierung (‘‘2’’ == 2)
TypeScript = kaum eine Konvertierung
Wann werden Typen in JavaScript gegenüber TypeScript überprüft?
JavaScript = runtime
TypeScript = Compile Time
Wann fallen Typisierungsfehler in JavaScript gegenüber TypeScript auf?
JavaScript = Runtime (Meistens)
TypeScript = Compile Time (Meistens)
Was bedeutet JavaScripts dynamische Typisierung?
Es muss das Programm laufen lassen, um zur runtime zu bestimmen welche Typen es besitzt und kennt sie nicht vorher
Was für eine Art von Typisierung ist TypeScript?
TypeScript ist eine graduell typisierte Sprache
Was bedeutet es, dass TypeScript eine graduell typisierte Sprache ist?
Typescript ist graduell typisiert, da es mit 100% type coverage am besten funktioniert sich aber Typen auch selber ableiten kann
Wie viel % type coverage sollte man anstreben?
Sofern man nicht gerade ein JavaScript Projekt migriert sollte es 100% type coverage sein
Was bedeutet es das JavaScript weakly typed ist?
Es versucht für den Developer die Typen automatisch zu konvertieren und vermeintlich sinvoll zu behandeln
Was passiert in JavaScript bei
3 + [1] ?
JavaScript merkt zur Runtime das 3 eine Nummer ist und [1] ein Array
Weil + benutzt wird denke es an Konkatenation
Es konvertiert 3 in einen String ‘‘3’’
Es konvertiert [1] in einen String ‘‘1’’
Es konkateniert diese zum String Ergebnis ‘‘31’’
Was passiert in TypeScript bei
3 + [1] ?
Es entsteht zur Compile Time der Fehler TS2365 Operator + cannot be applied to types ‘3’ and number[]
Was sollte man immer machen wenn man Typen konvertieren muss?
Diese explizit Typisieren, damit die Übersicht behalten werden kann
Welche Arten von Errors throwed TypeScript zur Compile Time?
Syntax Error
Type Erorr
Warum wird TypeScript als incrementally compiler statically typed language bezeichnet?
Weil sie durch Inkrementierung schnell rekompiliert werden kann. Es werden nur die Veränderungen neu kompiliert und nicht das ganze Programm mit Stellen die gleichgeblieben sind
Welche Arten von Error kann TypeScript nicht entdecken?
Stack Overflow
Kaputte Netzwerkverbindungen
Falsche Nutzereingaben
Wann tauchen Error auf die TypeScript nicht entdecken kann?
Zur Runtime bei Developer oder beim Kunden
Wie kann Typescript konfiguriert werden?
Versioniert mit einer tsconfig.json im Rootverzeichnis
Sie installiert man TypeScript und Linting?
NodeJS herunterladen
npm install –save-dev typescript tslint @types/node
Was macht die Datei tsconfig.json
Sie stellt die Konfiguration für TypeScript, um anzugeben welche Dateien kompiliert werden sollen und in welche Verzeichnisse.
Auch die Version von JavaScript die erzeugt werden soll wird hier definiert
Was machen die Bestandteile dieser tsconfig.json
{
''compilerOptions'': {
''lib'': [''es2015''],
''module'': ''commonjs'',
''outDir'': ''dist'',
''sourceMap'': true,
''strict'': true,
''target'': ''es2015''
},
''include'': [
''src''
]
}
include = Welche Dateien für TypeScript untersuchen
lib = Welche JavaSceipt API soll für die Ausführung des Codes genutzt werden? (bind, assign, queryselector)
module = Zu welchem module system soll kompiliert werden (commonjs, systemjs, es2015 etc)
outDir = Wo soll das generierte JavaScript hin
strict = sollte immer true sein um vollständige Typisierung zu erzwingen
target = Welche JavaScript Version soll kompiliert werden (ES2015, ES2016 etc)
Was macht die Datei tslint.json?
Bietet Einstellungen für TypeScript Linting
Dort werden die Coding Conventions für
Was ist ein Type?
Ein Set an Werten und Dingen die man mit diesen tun kann
Was ist ein Beispiel für ein Type?
boolean
- mit Werten true & false
- Mit Methoden || && !
Woher weiß ein Typechecker welche Dinge für einen Typ valide sind?
Er schaut auf den bekannten Type und überprüft ob Wertzuweisungen und Methodenaufrufe bekannt sind
Was bedeutet function xy Parameter ist contrained als number?
Die Funktion xy besitzt einen Parameter welcher mit Typescript auf einen Wert des Typs number festgelegt ist
Was bedeutet
der Type des Wertes 2 ist assignable zu number?
Dass der Type des zugewiesene Wertes 2 kompatibel mit dem Typ number ist
Wie nennt man eine Function die keine Typisierung in ihren Parametern besitzt?
Uncontrained
Was bedeuten bounds und upper bound in Typescript?
ERGÄNZEN
Was ist der Type any?
- any steht als Type für alles
- any ist der default Type
- any sollte immer nur die letzte Option sein
Warum sollte any immer die letzte Option sein?
- any ist alles und lässt alle Werte und auch alle unzulässigen Methodenaufrufe zu die zu Fehlern führen können
- any entgeht TypeScript und führt JavaScript Verhalten ein
- any sollte inmer nur explizit als annotation genutzt werden
Wie geht TypeScript mit dem strict config flag und any um?
- Any wird nicht zugelassen
Wann kann man unknown benutzen?
- Um bei einem noch unbekannten Typen any zu vermeiden
- Bis man den Wert kennt kann man unknown einsetzen und TypeScript erinnert einen dann an das Redefinement und den Type zu ergänzen
Wie kann man ein Refinement vornehmen und temporäre unknown Types zu korrigieren?
- Mit JavaScript typeof und instanceof Operatoren um deren Typen zu bestimmen
Welche Methoden/Operationen erlaubt unknown?
- Vergleiche mit anderen unknown Types mittels ===, ||, && und ?
- Negieren mit !
- Refinement mit typeof und instanceof
Infered TypeScript etwas selber zu unknown?
- Nein, es muss explizit annotiert werden
Was beinhaltet der Type number?
- Ein Set aller Zahlen (integer, float, positives, negatives, infinity, NaN
- Methoden wie + - %
- Vergleiche wie < >
Sollte man für Typen wie number oder boolean die Types inferen lassen und nicht explizit annotieren?
- Ja, es gibt keinen Grund etwas als number zu annotieren
- Nur wenn man mit beschränkten Zahlenräumen arbeitet dann kann es Sinn machen
Was macht der Type bigint?
- Erlaubt hohe Zahlenoperationen ohne Rundungsfehler
- Sollte infered werden wenn möglich
Was ist der Type string?
- Das Set aller Strings
und Methodike dieser wie Konketanation Slice etc
Sollten Strings von TypeScript infered oder explizit anmotiert werden?
- Infered um den Code schmal zu halten
Was ist der Type symbol?
- Ist ziemlich neu in ES2015 und selten
- Alternative für string keys in Objects und Maps
- Verwendet man um sicherzustellen dass genau der richtige und bekannte key genutzt wird und nichts überschriebenes
Was sind Type Objects in JavaScript?
- ## TypeScript kann mit Absicht nicht zwischen Erzeugung mit new Object und { } unterscheiden
Was ist Structual Typing oder Duck Typing?
- Wenn man sich nur um die Eigenschaften und den Inhalt eines Objektes kümmert und nicht dessen Namen
Was ist Nominal Typing?
- Wenn man sich explizit auch für den Namen eines Objektes interessiert und nicht nur wie beim Duck Typing um dessen Eigenschaften/Inhalt
Wie deklariert man eine variable als Type unknown?
- Explizit
- let a: unknown = 30
Wie deklariert man eine Variable als Type boolean?
- Infered
- let b = true
Wie deklariert man eine Variable vom Type number?
- Infered
- let a = 1234
Wie deklariert man eine Variable von Type bigint?
- Infered wenn möglich
- let a = 1234n
Wie deklariert man eine Variable vom Type string?
- Infered
- let a = ‘hello’
Wie deklariert man eine Variable vom Type symbol?
- Infered
- let a = Symbol(‘a’)
Was sind Probleme mit dem Type object?
- Es ist erstmal nur wenig restriktiver als any
- Es definiert nur, dass etwas ein Object ist aber nicht was mit dem Inhalt getan werden kann
Welche beiden Arten nutzt man zur Deklaration einer Variable von Type Object?
- Infered
- let a = { b: ‘x’ }
oder
- Explizit
- let a = { b: string } = { b: ‘x’ }
Warum gibt es eine Type Inference bei Type Object und was ist es?
- Tritt nur bei der Nutzung von const auf bei Dingen wie Objects oder Arrays auf
- Man kann den Inhalt nach Deklarierung trotz const im Gegensatz zu Variablen noch dynamisch austauschen
- Daher infered TypeScript bei const a = { b: number } = { b: 12 } // b ist number und nicht Literal 12
- Um die Dynamik zu wahren wird nur der Typ und kein Literal des Wertes infered
