Présentation du design pattern Observer. Nous verrons ce que sont les design patterns, les différentes implémentations du pattern Observer, ainsi qu'une mise en perspective avec le pattern Publisher Suscriber.

1. LE PATTERN
OBSERVER

2. Plan de la présentation
1. Introductionaux Design Patterns
– Présentationdu concept
– Pourquoi utiliser les design patterns ?
– La classification
2. Le pattern Observer
– Définition du pattern
– Les objets clés et leur comportement
– 2 implémentations possibles : Push & Pull
– Cas d'utilisation
– Avantages et inconvénients
3. Implémentation en TypeScript
4. Parallèle avec le pattern Publisher / Suscriber
5. Sources
6. Conclusion
7. Questions

3. LES DESIGN
PATTERNS
Introduction

4. Qu'est-ce
que c'est ?
■ A l'origine, les design patterns sont
issus de l'architecture, avec un concept
de Christophe Alexander dans les
années 1970
■ 23 designs
patterns formalisés par GoF en 1994
■ Ce sont des patrons de conception,
comme les plans d'un architecte
■ Ce sont des idées abstraites de
comment résoudre un problème
récurrent
■ Ce sont de bonnes pratiques
documentées

6. Pourquoi les
utiliser ?
■ Accélérer le développement
■ Anticiper des problématiques
■ Améliorer la lisibilité du code
■ Utiliser un
vocabulaire commun
■ Rendre le code plus
maintenable : ouvert à
l'extension et fermé à la
modification

7. La classification
Patterns de Structure
• Expliquent comment
assembler des objets et
des classes en de plus
grandes structures, tout
en les gardant flexibles et
efficaces
Patterns de Création
• Fournissent des
mécanismes de création
d'objets, ce qui augmente
la flexibilité et la
réutilisation du code
Patterns de Comportement
• Mettent en place une
communication efficace et
répartissent les
responsabilités entre les
objets

8. OBSERVER Catégorie :
Comportement

9. Le pattern Observer fonctionne
comme un abonnement à un magazine
1. Un éditeur se lance dans les affaires et commence à
diffuser des journaux.
2. Vous souscrivez un abonnement. Chaque fois qu’il y a une
nouvelle édition, vous la recevez. Tant que vous êtes
abonné, vous recevez de nouveaux journaux.
3. Quand vous ne voulez plus de journaux, vous résiliez votre
abonnement. On cesse alors de vous les livrer.
4. Tant que l’éditeur reste en activité, les particuliers, les
hôtels, les compagnies aériennes, etc., ne cessent de
s’abonner et de se désabonner.

11. Définition
Le pattern Observer définit une dépendance du type 1
à plusieurs entre des objets de manière que, quand un
objet (le sujet) change d'état, tous les objets
dépendants en soient notifiés afin de pouvoir
réagir conformément.

12. Les objets clés du pattern Observer
• Hérite de la classe abstraite
Observable
• Stocke une liste d'observateurs
• Stocke un état dont dépendentles
observateurs
• Envoie une notification à ses
observateursquand cet état change
Le Sujet
• Implémente l'interfaceObserver
• Garde une référence au sujet
• Stocke l'état du sujet qui doit être
toujours à jour
L'Observateur

13. Push vs Pull : 2 implémentations
Push permet d'envoyer toutes les
informations du sujet vers les observateurs
via un paramètre dans la méthode update()
Pull notifie simplement les observateurs
et les laisse demander les informations
dont ils ont besoin grâce aux méthodes
publiques du sujet

14. Quand l'utiliser ?
Utilisez le patron de conception Observer quand des
modifications de l’état d’un objet peuvent en
impacter d’autres, et que l’ensemble des objets
n’est pas connu à l’avance ou qu’il change
dynamiquement.

15. Avantages
•Modulable : Le pattern Observer permet
de varier les sujets et les
observateurs indépendamment. On peut
réutiliser les sujets sans les mêmes
observateurs et vis-versa. Un
observateur peut également suivre
plusieurs sujets
•Maintenable : Il est possible d'ajouter
des observateurs sans modifier le sujet,
ni les autres observateurs
•Faiblement couplé : Le sujet n'a pas
besoin de connaître la classe concrète
de ses observateurs, elle a juste besoin
de savoir qu'ils implémentent l'interface
Observer
Inconvénients
•Le risque qu'on peut rencontrer est
d'engendrer une cascade d'update des
observateurs au moindre changement
du sujet
•On ne peut pas choisir l'ordre dans
lequel les observateurs sont notifiés
•Il faut bien penser, en cas de
suppression du sujet, à supprimer les
observateurs de la liste pour qu'ils
cessent de suivre son état

16. IMPLÉMENTATION En TypeScript

17. L'interface Subject

18. L'implémentation du Sujet (attributs)

19. L'implémentation du Sujet (méthodes)

20. L'interface Observer

21. Les implémentations des Observateurs

22. Le client – Output

23. COMPARAISON
AVEC LE PATTERN
PUBLISHER /
SUSCRIBER
Catégorie :
Comportement

24. Présentation
Le pattern Publisher / Suscriber est relativement similaire au pattern
Observer, à la différence qu'il n'y a pas d'abonnement direct entre les
Publishers et les Suscribers.
Le publisher et le suscriber ne se connaissent pas l'un l'autre.
A la place, ils ont un lien avec un 3e composant, appelé broker,
message broker ou event bus qui s'occupe de filtrer les messages
des publishers et de les distribuer aux suscribers intéressés.
Il existe plusieurs façons de filtrer les messages, les plus connues
étant Topic-based et Content-based.
On peut considérer le pattern pub sub comme une variation du
pattern Observer, de par la similarité de leur concept.

26. Différences
Observer
• Les observateursont une référence
au sujet, et le sujet stocke une
liste d'observateurs
• Couplage plus fort
• Synchrone
• Architecture single-application
address space : tout se passe dans la
même application
Publisher / Subscriber
• Les publishers et suscribersne se
connaissentpas les uns les autres,
ils communiquentsimplement à l'aide
de messages queues ou brokers
• Couplage plus faible
• Asynchroneavec une message queue
• Architecturecross-application :
dialogue entre plusieurs applications

28. Sources
■ Design patterns - Tête la première
■ Refactoring.Guru
■ Tekcollab.imdeo
■ JavaScript Design Pattern (EN)
■ 5 TypeScript Design Patterns You Should Know

29. En résumé
■ Les Design Patterns sont des
patrons de conception communs à
tous les langages de programmation
■ Le Javascript est un langage
évènementiel basé sur le principe
d'Observer / Observable
(addEventListener)
■ Le pattern Observer fonctionne
comme un abonnement à un
magazine
■ Le pattern Pub / Sub ressemble à
Observer mais s'utilise dans les
architectures distribuées
■ Pub / Sub utilise un broker pour
répartir les messages envoyés par le
publisher dans la bonne queue à
laquelle sera inscrite le suscriber

30. MERCI POUR
VOTRE ATTENTION
Des questions ?