Observer & Strategy

1// Observer pattern générique et typé
2type Observer<T> = (value: T) => void;
3
4class EventEmitter<T> {
5  private observers = new Set<Observer<T>>();
6
7  subscribe(observer: Observer<T>): () => void {
8    this.observers.add(observer);
9    // Retourne une fonction de désabonnement
10    return () => this.observers.delete(observer);
11  }
12
13  emit(value: T): void {
14    this.observers.forEach((obs) => obs(value));
15  }
16}
17
18// Exemple : système de progression
19interface ProgressEvent {
20  lessonSlug: string;
21  completed: boolean;
22  totalProgress: number;
23}
24
25class ProgressTracker {
26  private progress = new Map<string, boolean>();
27  readonly onChange = new EventEmitter<ProgressEvent>();
28
29  markCompleted(lessonSlug: string, totalLessons: number): void {
30    this.progress.set(lessonSlug, true);
31    const completed = [...this.progress.values()].filter(Boolean).length;
32    this.onChange.emit({
33      lessonSlug,
34      completed: true,
35      totalProgress: completed / totalLessons,
36    });
37  }
38}
39
40// Utilisation
41const tracker = new ProgressTracker();
42
43// S'abonner
44const unsub = tracker.onChange.subscribe((event) => {
45  console.log(`Progression: ${Math.round(event.totalProgress * 100)}%`);
46  if (event.totalProgress === 1) showCompletionBadge();
47});
48
49tracker.markCompleted('html-intro', 10);
50
51// Se désabonner
52unsub();