TypeScript-Artikel überarbeitet#94
Open
JohannesHoppe wants to merge 11 commits into
Open
Conversation
- Hinweis-Box durch sanfteren Einstieg ersetzt, Zielgruppe (Crashkurs) klar benannt - sechs von Danny auskommentierte Abschnitte reaktiviert: Variablen, Template-Strings, Arrow Functions, Immutability, Spread/Rest, Promises/async-await
- Doppelten Absatz nach Intro entfernt (wiederholte bereits die Intro) - "TypeScript einsetzen" gestrafft, Komfortfunktionen zusammengezogen - "Konfiguration" gestrafft (Transpilation steht schon oben) - Superset-Aussage präzisiert: TypeScript ist strenger als JavaScript (nur mit gelockerten Einstellungen nähert es sich reinem JS an)
…ng aktualisiert Neue Reihenfolge folgt der Progression eines Crashkurses: - JavaScript-Basics (Variablen, Template-Strings, Arrow Functions, Spread/Rest, Immutability, Optional Chaining, Nullish Coalescing, Promises/async-await) - TypeScript-Typsystem (Basistypen, Union Types, Interfaces, Generics) - Objektorientierung (Klassen, Private, Property Modifiers) - Angular-spezifisch (Decorators) - Meta (Konfiguration, Zusammenfassung) "Weitere Features" wurde aufgelöst, die drei Unterabschnitte (Union Types, Optional Chaining, Nullish Coalescing) stehen jetzt als eigenständige h2-Abschnitte an den passenden Stellen. Die Zusammenfassung wurde an die neue Crashkurs-Zielgruppe angepasst und spricht nicht mehr Umsteiger von C#/Java an. Alle 32 Code-Beispiele und alle Textinhalte sind erhalten, nur die Position und drei Überschriftenebenen wurden verändert.
…henfolge fixiert 19 inhaltliche Verbesserungen aus einer kompletten Lesung mit Einsteiger-Brille: Erklärungen und Begriffe: - Mini-Transpilierungs-Beispiel zeigt vorher/nachher - Zweites Transpilier-Beispiel mit Konstruktor-Kurzschreibweise - "nullish" kurz erklärt vor Nullish Coalescing - Synchron vs. asynchron erklärt vor Promises - "Metadaten" bei Decorators erklärt Reihenfolge und Beispiele: - Variablen-Abschnitt komplett neu: erst const, dann let, dann kurzer var-Hinweis (Wortspiel "var-heit" entfernt) - Immutability vor Spread (Problem vor Lösung) - Schmerz-Beispiel bei Optional Chaining mit explizitem | undefined-Typ - URL-Beispiel aus Listing 20.1 bei Template-Strings (vereinfacht) - "drei Bestandteile" bei Klassen entschärft - Getter/Setter ohne #, mit echtem Setter-Beispiel, "Methoden verstecken" umformuliert Inhaltliche Erweiterungen: - this-Kontext bei Arrow Functions mit Problem-Code und Lösungs-Code - unknown-Use-Case mit catch (error: unknown) - Union Types: String-Literal-Union als zweites Beispiel - Generics: eigene generische Funktion first<T> vor signal() - Decorators: @directive, @pipe und @service ergänzt - private vs # entschärft, beide als gültig markiert Konfiguration und Fakten: - "Schnittstellen" -> "Datenstrukturen" (vermeidet Konfusion mit Interfaces) - "wichtigste Einstellung ist target" korrigiert: strict ist heute zentraler, target nachgelagert - fn4-Kommentar bei Arrow Functions präzisiert
…Rückbezug Klassen, Private Eigenschaften und Property Modifiers wurden in den Bereich der JS-Basics gezogen und stehen jetzt direkt nach Template-Strings. Damit ist die Klassen-Syntax eingeführt, bevor sie in Arrow Functions (this-Kontext, Counter-Beispiel) verwendet wird. Im Konstruktor-Abschnitt zusätzlicher Rückbezug auf die Transpilier- Kurzschreibweise aus dem Intro, um die Doppelung zu entschärfen.
Drei Strukturänderungen, die zusammen den künstlichen JS-Basics/ TS-Typsystem-Split auflösen: 1. Klassen-Beispiele nutzen jeweils semantisch passende Namen (Book, Point, Animal/Dog, BankAccount) statt überall User 2. Basistypen direkt nach Variablen — Typannotationen sind dann von Anfang an klar, wenn sie in Klassen und Funktionen verwendet werden 3. Künstliche JS/TS-Übergangssätze entfernt — die Reihenfolge der Abschnitte spricht für sich
Mehrere kleinere Verbesserungen aus der zweiten Lesung: - Optional Chaining: doppelten user-Setup-Code im Lösungsblock entfernt - any als Standardtyp: präzisiert (gilt nur ohne strict mode, in Angular Compiler-Fehler) - Arrow Functions: "Kurzschreibweise" geschärft, Lambda-Ausdruck-Hinweis entfernt (fachlich nicht korrekt) - Property Modifiers: Config-mit-Klartext-Secret durch Task-Beispiel ersetzt - Eigenschaften: Zugriffsmodifizierer und Modifier sauber getrennt, static jetzt direkt erklärt - Methoden: "erweitern die Klasse mit Logik" -> "enthalten ihre Logik" - Konstruktor: "muss den Namen tragen" -> "heißt immer constructor", Instanziierung -> Erzeugen einer neuen Instanz - unknown: "schafft Abhilfe" -> "Im Gegensatz dazu", plus Klarstellung, dass auch unknown nur ein Notnagel ist - TypeScript einsetzen: "Typisierung geht verloren" -> neutrales "Typinformationen werden entfernt" - Union Types: Konzept der Vereinigung jetzt explizit erklärt - Property Modifiers: holpriger Doppelpunkt durch vollständigen Satz ersetzt
Alle Gedankenstriche (em-dash und en-dash) im Fließtext durch Satztrennungen oder Kommata ersetzt. Auch in den Code-Kommentaren für Konsistenz angepasst. 13 Stellen im Fließtext und 5 in Code-Kommentaren betroffen.
d-koppenhagen
approved these changes
May 12, 2026
|
|
||
| ```typescript | ||
| try { | ||
| // riskante Operation |
Member
There was a problem hiding this comment.
"riskant" klingt irgendwie so dramatisch
fmalcher
reviewed
May 12, 2026
Member
fmalcher
left a comment
fmalcher
left a comment
There was a problem hiding this comment.
Was ist denn mit Import/Export?
| published: 2026-02-10 | ||
| lastModified: 2026-02-05 | ||
| hidden: true | ||
| lastModified: 2026-04-22 |
| ## Konfiguration | ||
|
|
||
| Die Konfiguration des TypeScript-Compilers wird in der Datei `tsconfig.json` hinterlegt. | ||
| Eine zentrale Einstellung ist `strict`: Mit `strict: true` werden alle strengen Typprüfungen aktiviert (siehe oben). |
Member
There was a problem hiding this comment.
Prüfen: fällt mit ng22 weg, weil Default?
|
|
||
| In einem Angular-Projekt müssen wir uns über die Konfiguration von TypeScript nur wenige Gedanken machen, denn die Einstellungen sind bereits mit sinnvollen Werten vordefiniert. | ||
| Auch im Angular-Ökosystem begegnen uns Generics häufig. | ||
| Die Funktion `signal()` (mehr dazu im Buch) erzeugt einen reaktiven Wert mit generischem Typ: |
Member
There was a problem hiding this comment.
Ich stolpere über "Erzeugt reaktiven Wert". Vielleicht "erzeugt ein Objekt, das einen reaktiven Wert hält"
| console.log(zero ?? 'fallback'); // 0 | ||
| class Document implements Printable { | ||
| print(): void { | ||
| console.log('Printing...'); |
Member
There was a problem hiding this comment.
Suggested change
| console.log('Printing...'); | |
| console.log('Printing ...'); |
| Mit *Generics* können wir Typparameter für Klassen und Funktionen definieren. | ||
| Sie sind ein wichtiges Konzept in TypeScript, um wiederverwendbare und flexible Funktionen zu erstellen. | ||
| Als *nullish* gelten in JavaScript die Werte `null` und `undefined`. | ||
| Der `??`-Operator (Nullish Coalescing) liefert einen Rückfallwert, wenn der linke Wert nullish ist: |
Member
There was a problem hiding this comment.
Hier noch sagen, dass || auf falsy reagiert? Das wird nur unten im Code gezeigt
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
3 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Crashkurs-Stil, neue Reihenfolge, alle Abschnitte bleiben