Lies diese JavaScript-Snippets für Anfänger Zeile für Zeile — jedes kommt mit einer Erklärung, was der Code tut und warum.
Template-Strings (unter Verwendung von Backticks ``) ermöglichen es Ihnen, Variablen mithilfe der Syntax ${variable} einfach in Zeichenketten einzubetten, was den Code viel sauberer macht als die V…
Snippet öffnen →In modernem JavaScript wird 'const' für Werte verwendet, die gleich bleiben, während 'let' für Variablen verwendet wird, die sich später ändern. Die standardmäßige Verwendung von 'const' ist eine b…
Snippet öffnen →Arrays werden verwendet, um Listen von Daten zu speichern. Die Methode '.push()' fügt ein neues Element am Ende des Arrays hinzu, und '.length' sagt Ihnen, wie viele Elemente enthalten sind.
Snippet öffnen →Der Kontrollfluss ermöglicht es Ihrem Programm, Entscheidungen zu treffen. Der 'if'-Block wird nur ausgeführt, wenn die Bedingung in Klammern wahr ist; andernfalls wird der 'else'-Block ausgeführt.
Snippet öffnen →Pfeilfunktionen bieten eine prägnante Möglichkeit, Funktionen zu schreiben. Wenn die Funktion nur einen Ausdruck hat, können Sie sogar das Schlüsselwort 'return' und die geschweiften Klammern wegla…
Snippet öffnen →Objekte speichern Daten in Schlüssel-Wert-Paaren. Du kannst auf diese Werte mit einem Punkt (Punkt-Notation) oder eckigen Klammern (Klammer-Notation) zugreifen.
Snippet öffnen →Jeder String in JavaScript hat eine 'length'-Eigenschaft, die dir automatisch sagt, wie viele Zeichen (einschließlich Leerzeichen) in diesem String enthalten sind.
Snippet öffnen →Eine Funktionsdeklaration definiert einen wiederverwendbaren Codeblock mit einem Namen. Im Gegensatz zu Arrow-Functions werden diese 'gehoistet', d.h. sie können aufgerufen werden, bevor sie im Cod…
Snippet öffnen →Die 'for...of'-Schleife bietet eine saubere und einfache Möglichkeit, über Elemente in einem Array oder anderen iterierbaren Objekten zu iterieren.
Snippet öffnen →In JavaScript solltest du '===' (strikte Gleichheit) gegenüber '==' (lose Gleichheit) bevorzugen. Die strikte Gleichheit prüft, ob sowohl der Wert als auch der Typ identisch sind.
Snippet öffnen →Die Interpolation ermöglicht es dir, dynamische Daten aus deiner TypeScript-Klasse direkt in deinem HTML-Template anzuzeigen, indem du doppelte geschweifte Klammern verwendest.
Snippet öffnen →Die Event-Bindung in Angular ermöglicht es dir, auf Benutzeraktionen wie Button-Klicks zu reagieren, indem du eine Funktion in deiner TypeScript-Klasse aufrufst.
Snippet öffnen →Die *ngIf-Direktive wird verwendet, um ein HTML-Element basierend auf einem booleschen Wert bedingt in das DOM aufzunehmen oder daraus zu entfernen.
Snippet öffnen →Die *ngFor-Direktive wiederholt ein Element für jedes Element in einer Sammlung, wie zum Beispiel einem Array von Strings.
Snippet öffnen →Angular verwendet TypeScript, was es dir ermöglicht, Datentypen für deine Variablen zu definieren. Dies hilft, Fehler zu vermeiden, indem die Datenkonsistenz sichergestellt wird.
Snippet öffnen →Die Zwei-Wege-Datenbindung ermöglicht es, dass Daten automatisch von der Komponente zur Ansicht und von der Ansicht zurück zur Komponente fließen. Sie verwendet die 'Banane-in-der-Kiste'-Syntax [()].
Snippet öffnen →Der @Input-Dekorator markiert eine Klasseneigenschaft als Eingabe, sodass eine Elternkomponente Daten an diese Kindkomponente übergeben kann.
Snippet öffnen →Komponenten verwenden @Output-Eigenschaften in Kombination mit einem EventEmitter, um Daten oder Benachrichtigungen an ihre Elternkomponente zurückzusenden.
Snippet öffnen →Eine Template-Referenzvariable (deklariert mit #) erstellt eine Referenz auf ein DOM-Element und macht es im gesamten Template zugänglich, ohne dass Komponentenlogik erforderlich ist.
Snippet öffnen →Pipes sind einfache Funktionen, die in Template-Ausdrücken verwendet werden, um einen Eingabewert entgegenzunehmen und eine formatierte Version für die Anzeige zurückzugeben.
Snippet öffnen →Dependency Injection (DI) ist ein Kernmuster, bei dem eine Klasse Abhängigkeiten von externen Quellen anfordert, anstatt sie selbst zu erstellen. In Angular injizieren Sie Services über den Konstru…
Snippet öffnen →Der @Injectable-Decorator markiert eine Klasse als verfügbar, um als Abhängigkeit injiziert zu werden. 'providedIn: root' macht den Service zu einem Singleton, das in der gesamten App verfügbar ist.
Snippet öffnen →Der ngOnInit-Hook wird von Angular aufgerufen, nachdem die datengebundenen Eigenschaften der Komponente zum ersten Mal initialisiert wurden. Es ist der beste Ort für Initialisierungslogik wie das L…
Snippet öffnen →Der Safe Navigation Operator verhindert Fehler beim Zugriff auf Eigenschaften eines Objekts, das null oder undefiniert sein könnte. Er bricht die Auswertung ab, wenn eine Referenz fehlt.
Snippet öffnen →Angular-Komponenten verwenden standardmäßig View Encapsulation. Stile, die innerhalb einer Komponente definiert sind, gelten nur für deren eigenes Template und beeinflussen nicht den Rest der Anwen…
Snippet öffnen →Signals sind ein reaktives Primitiv in Angular, das Zustandsänderungen verfolgt und gezielte UI-Updates effizient auslöst.
Snippet öffnen →Standalone-Komponenten vereinfachen die Angular-Entwicklung, indem sie die Notwendigkeit aufheben, Komponenten in einem NgModule zu deklarieren.
Snippet öffnen →FormControl wird in reaktiven Formularen verwendet, um den Status, den Wert und die Validierung eines bestimmten Eingabefelds zu verwalten.
Snippet öffnen →Der @HostListener-Dekorator ermöglicht es einer Komponente, auf Ereignisse des globalen Windows oder des Documents zu reagieren.
Snippet öffnen →Zugriffsmodifikatoren wie private und public werden in Angular-Klassen verwendet, um interne Daten zu kapseln und externe Eigenschaften bereitzustellen.
Snippet öffnen →