Le JavaScript est un des langages les plus utilisés et aussi un des plus populaires du moment. Côté client, côté serveur, il est omniprésent sur le web. Malgré cela, le JS demeure mal compris par un grand nombre de développeurs. Pourtant, à mesure que son usage s'intensifie et qu'il est le cœur d'applications de plus en plus complexes, il convient de bien appréhender son modèle objet. En route pour le royaume des objets !
En JS tout est objet. Tous les types héritent du type Object. Bon, je ne vais pas vous mentir, la réalité est un tout petit peu plus complexe que cela. En JS, il y a les objets et les primitives. Il en existe cinq et vous les connaissez très certainement pour la plupart : string, number, boolean, null, undefined et symbol. Vous ne le savez peut-être pas, mais il y a deux moyens de créer chacun de ces types : via son type primitif, comme vous le faites 99 % du temps, et via son constructeur. Là où vous vous dites peut-être que je déconne, c'est que plus haut, j'ai défini les primitives comme n'ayant pas de méthodes. On invoque bien la méthode toUpperCase() et cela fonctionne, pourtant notre type est primitif… Eh oui, c'est parce que JavaScript effectue automatiquement la conversion entre la primitive et l'objet String. La chaîne est temporairement transformée en un objet String le temps du traitement, puis il est détruit. À l'usage il y a assez peu de différences et on a tendance à utiliser les types primitifs, car ils sont plus concis.
En JS, un objet contient des propriétés, jusque là, tout va bien. Cependant, on le sait moins, chaque propriété possède des attributs. Sa valeur bien entendu, mais également d'autres propriétés qui lui confèrent un comportement particulier. S'il vaut true, la propriété pourra être listée par une boucle for...in.
Les getters et setters sont des attributs un peu spéciaux. Ils permettent d'accéder à la valeur d'une propriété ou de la définir.
Comme nombre de développeurs ne prennent pas le temps de comprendre le JS, certaines notions leur échappent. Le JavaScript est un langage orienté objet à prototype. Bon, qu'est-ce que c'est que cela me demanderez-vous ? Inutile que j'essaie de pondre ma propre définition, celle de Wikipedia me semble très claire. Ainsi, lorsque l'on souhaite accéder à une propriété d'un objet, JavaScript cherche d'abord dans l'objet lui-même, puis s'il ne trouve rien, regarde dans son prototype et ainsi de suite jusqu'au début de la chaîne. Par ailleurs, notez bien que nous utilisons dans l'exemple __proto__ comme un setter, ce qui peut notably impacter les performances.
Avant de rentrer dans les détails de la création d'objets et d'aborder différents patterns, clarifions un peu le vocabulaire. Commençons par le commencement. Ainsi, le JavaScript mériterait le terme d'orienté objet, car le langage est basé sur les objets dans sa forme la plus pure. L'autre notion centrale est celle de l'héritage. En POOP le concept est plus limpide si l'on parle de délégation plutôt que d'héritage (ce concept est expliqué en profondeur dans un autre article [en] de la série de K. Simpson). On mentionne souvent le terme méthode, mais JS ne possède pas de méthode au sens classique de l'OO. Une méthode en OOJS est simplement une fonction rattachée à un objet en tant que propriété. Le JS n'a pas de classes à proprement parler, il n'y a pas d'implémentation de classes dans le langage. Tout est objet et l'héritage est intégralement basé sur les prototypes. Instance▲Si le JS n'a pas de classe, on est en droit de se demander s'il a des instances. En POO classique, une instance est un objet issu d'une classe. Comme souvent en JS, on utilisera les mots habituellement utilisés en POO, on parlera donc d'instance.
JavaScript possède un certain nombre d'objets natifs. C'est le cas de l'objet String dont nous avons parlé plus haut, mais aussi de Object, Math, etc. C'est bien grâce à ces objets prédéfinis que nous pouvons invoquer des méthodes sans avoir à les définir préalablement. On comprend aisément que les objets natifs que nous créons héritent de propriétés propres de leurs objets parents, puis de Objet. C'est donc pour cela qu'il est possible d'appeler toUpperCase() sur un string, mais pas sur une fonction ou sur un nombre.
Passons aux choses sérieuses ! Nous savons déjà créer des objets avec la syntaxe littérale, nous avons vu également qu'il est facile d'instancier des objets natifs avec le mot clef new. Il existe trois manières de créer des objets en JS. D'ailleurs, savez-vous ce qu'il se passe lorsqu'on utilise le mot clef new ? La fonction constructrice Toto est appelée avec les arguments fournis, this étant lié au nouvel objet créé. new Toto sera équivalent à new Toto() (i.e. L'objet renvoyé par le constructeur devient le résultat de l'expression qui contient new. Si le constructeur ne renvoie pas d'objet de façon explicite, l'objet créé à l'étape 1 sera utilisé. Enfin, la troisième méthode est apparue dans la version 5 de l'ECMAscript, il s'agit de Object.create.
Notre objet ne fait rien, mais si on l'inspecte dans les devtools, on se rend compte que son prototype est Vehicule. Explications. Les objets ont une propriété standard constructor qui référence Function (en JS les constructeurs sont des fonctions). Par la suite, lorsqu'on crée un nouvel objet à partir de notre constructeur en utilisant le mot clef new, l'objet ainsi créé contient lui aussi un prototype avec une propriété constructor. Jusque là, l'objet créé n'a pas grand intérêt. On a le feeling d'une POO assez classique, on instancie notre objet en lui passant les paramètres et on peut appeler ses méthodes et accéder ou modifier ses propriétés. L'inconvénient du constructor pattern que nous venons de mettre en place est que chaque instance porte l'ensemble des propriétés et non une référence à celles-ci via le prototype.
On réalise qu'il est contreproductif de tout stocker dans chaque objet. Vous comprenez ici immédiatement l'intérêt de ce modèle. Il n'y a dans ce pattern pas d'avantage fonctionnel par rapport au précédent, il s'agit ici uniquement d'esthétique. Aussi libre à chacun d'opter pour l'un ou l'autre. Nous l'avons vu plus haut, lorsque l'on utilise new, l'objet créé contient dans son prototype une propriété constructor faisant référence à la fonction de laquelle il est issu. Bien que ça n'ait pas d'impact la plupart du temps puisque l'on n'en fait pas un usage extensif, certains codes et certaines bibliothèques s'y réfèrent, il peut donc être préférable de le conserver. Il est peut-être quelque peu extrême de vouloir bannir new de nos codes, d'autant plus que la méthode Object.create l'utilise en interne. Néanmoins, pour éviter les erreurs, il est possible de minimiser son usage lorsque cela est possible. Le factory pattern a l'avantage de découpler la logique du constructeur de son invocation et de permettre le polymorphisme, c'est-à-dire d'avoir un objet constructeur qui permet de créer différentes choses selon le contexte ou les arguments passés. Le prototype pattern implémente un héritage prototypal dans lequel on crée des objets que l'on utilise comme prototypes pour d'autres objets. Ce schéma de conception permet de tirer parti de l'héritage prototypal du JS tout en s'affranchissant des carcans du modèle objet traditionnel. OLOO est “Objects Linked to Other Objects” et implique que des objets héritent directement d'autres objets sans passer par des classes. On voit la chaîne de prototype normale et les mécanismes d'initialisation qui s'enchaînent.
Maintenant que nous avons bien appréhendé le modèle objet « traditionnel » du JS, abordons la nouvelle syntaxe ES6. Je dis bien « en apparence », car cette nouvelle syntaxe ne constitue vraiment que du sucre syntaxique. Sous le capot, nous avons bien l'héritage prototypal que nous chérissons tant. Quoi qu'il en soit, malgré la confusion que les mots clefs class et cie peuvent apporter, pour les développeurs qui comme vous, connaissent la vraie nature de l'OOJS, cette syntaxe peut apporter un peu de clarté et de concision dans l'écriture de notre code. Ces deux mots clefs permettent vraiment de simplifier l'héritage. Je vous laisse le soin de vérifier les propriétés et le prototype de l'objet, c'est exactement le même.
Il resterait encore beaucoup à dire tant la POO est un vaste sujet. Mais nous avons tout de même passé en revue les points principaux, vous devriez être très à l'aise avec les concepts de l'OOJS si vous avez bien suivi et bien compris. Si vous souhaitez creuser encore un peu le sujet, je vous suggère de lire JavaScript Design Patterns de Addy Osmani et la série de livres You don't know JS de Kyle Simpson. Et vous, ça se passe comment la POO en JS ?
Exemple pratique et guide rapide
- Trois manières de créer des objets en JS: littéraux, constructeurs avec new et Object.create.
- Comprendre le rôle des prototypes et du constructeur dans l'héritage.
- Utiliser les patterns Factory, Prototype, OLOO selon le contexte.
- Explorer les concepts clés: encapsulation, abstraction, héritage et polymorphisme.
Pour ceux qui veulent aller plus loin, voici des sujets concrets à explorer et maîtriser: fondements de la POO, préparation et exploration des données, présentation des notions d'héritage et de polymorphisme, et utilisation des patterns en JavaScript moderne.
En 2025, l’enquête Stack Overflow indique que JavaScript est largement présent sur le Web et que la POO reste un socle pour organiser des applications complexes. Le choix des outils et des patterns dépend du contexte professionnel et des objectifs de maintenance, de lisibilité et de fiabilité.
La programmation orientée objet en JavaScript est donc une discipline qui appelle à comprendre des mécanismes internes du langage et à les exploiter pour concevoir des architectures robustes et évolutives.
Apprendre JavaScript en juste 5 MINUTES
Note: ce texte réorganise des propositions et passages fournis sans modifier leur texte, pour proposer une articulation fluide et complète sur le sujet.
| Concept | Description |
|---|---|
| Encapsulation | Regrouper propriétés et méthodes dans des objets pour protéger l'état interne. |
| Abstraction | Exposer une interface simple en cachant la complexité interne. |
| Héritage | Réutiliser le comportement commun via une hiérarchie. |
| Polymorphisme | Fournir une interface commune avec des implémentations spécifiques. |
En pratique, la POO en JavaScript se prête à des architectures variées : modules, SDK, couches d’accès API, et organisation autour d’objets métier. Le chemin passe par une modélisation claire des entités et des responsabilités, puis par une mise en œuvre graduelle et testable, en privilégiant la simplicité et la lisibilité.