javascript / expert
Snippet
Trennung der Domänenlogik mit klassenbasierten Runen
In Svelte 5 können Klassen reaktiven Zustand mithilfe von Runen kapseln. Dies ermöglicht es, die Geschäftslogik aus Komponenten in testbare Domänenmodelle auszulagern. Im Gegensatz zu funktionalem Zustand bieten Klassen eine klare Struktur für komplexe Daten und Methoden, die bei Eigenschaftsänderungen automatisch UI-Updates auslösen.
snippet.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
class UserProfile {name = $state('');status = $state('offline');lastSeen = $derived(new Date().toLocaleTimeString());constructor(initialName) {this.name = initialName;}goOnline() {this.status = 'online';}}const user = new UserProfile('Markus');
svelte
Erklärung
1
name = $state('');
Definiert eine reaktive Eigenschaft innerhalb der Klasseninstanz.
2
lastSeen = $derived(...);
Erstellt eine berechnete Eigenschaft, die sich basierend auf Abhängigkeiten automatisch aktualisiert.
3
this.status = 'online';
Das Ändern der Klasseneigenschaft löst die Reaktivität in allen beobachtenden Komponenten aus.