JavaScript

Classe

Remi Forax

Classe

Classe ?

“In object-oriented programming, a class is an extensible program-code-template for creating objects, providing initial values for state (member variables) and implementations of behavior (member functions or methods).”

source: Wikipedia.org - Class

Classe ?

“En programmation orienté objet, une classe est un programme-code-template extensible pour créer des objets, fournissant des valeurs initiales pour l'état (les variables membres) et les implantations de comportement (fonction membres ou méthodes).”

source : Wikipedia.org - Class

Définition d'une classe

Une classe définie un modèle/template de création d'objets.
On créé une instance (un objet) en utilisant l'opérateur new.

Méthodes

Une classe contient des fonctions associées à un objet appelées méthodes.

this ?

Dans une méthode, this est un paramétre implicite correspondant à l'objet sur lequel une méthode est appelée

Constructeur

On évite d'initialiser les champs directement, car
une classe contient une méthode qui se charge de l'initialisation appelé constructeur.

Constructeur et this

Au début du constructeur this vaut {} !

Classe ?

Une classe sert à regrouper au même endroit les fonctions/méthodes qui travail sur des objets ayant la même structure (les mêmes propriétés)

Accès au Champs/Méthodes

this doit être écrit explicitement pour l'accès aux champs/méthodes (pas comme C++/Java)

Classes et méthodes prédéfinies

Classe prédéfinie : tableau

Pour JavaScript, un tableau (Array) est un objet,
length est une propriété des objets tableaux

Classe prédéfinie : function

Pour JavaScript, une function (Function) est un objet,
name ou length sont des propriétés des objets fonctions

length renvoie le nombre de paramètres

Function.apply / Function.call

L'appel de fonction est équivalent à l'appel de la méthode call(undefined, arguments...) sur la fonction.
Le premier paramètre est la valeur de this.

apply() prend un tableau tandis que call prend les arguments séparés par des virgules

Appel de méthode

L'appel de méthode est équivalent à l'appel de la méthode call(objet, arguments..) sur le champ de l'objet.

Function.bind

Permet de créer une fonction à partir d'une fonction existante en indiquant la valeur des premiers arguments.

Attention, le premier argument est la valeur de this, pas le premier paramètre !

Fonction anonyme vs this

Une fonction flèche capture this. Une fonction classique prend this lors de l'appel (le paramètre devant le '.').

Fonction anonyme + bind(this)

Si on est en ECMAScript < 6, on peut s'en sortir en ajoutant un bind(this).

Down the Rabbit Hole

Et sans le mot-clé class ?

Le mot-clé class existe que depuis ECMAScript 6, avant on écrivait un code un peu différent.
Pour cela, il va falloir regarder comment le mot-clé "class" marche vraiment ...

Une classe est une fonction !

En JavaScript, une classe est une fonction !

Et une méthode est une fonction aussi !

Une méthode est une fonction stockée dans un objet avec le nom de la méthode comme nom de clé/propriété.

Object.create()

Object.create(prototype) permet de créer des objets comme {} mais en indiquant un [Prototype].
Un [Prototype] est un objet dans lequel aller chercher si on trouve pas dans l'objet courant

__proto__

On peut demander la valeur du [Prototype] d'un objet avec la clé __proto__.

Où sont les champs et les méthodes ?

Comme on veut partager les méthodes, on va les mettre dans le [Prototype]

Comment on crée un objet en JavaScript << 6

Une fonction joue le rôle de constructeur, le champ prototype de cette fonction joue le rôle de conteneur de méthodes.

Classe, fonction et champ prototype

Une classe est vue comme une fonction dont le code appelle le constructeur. Les méthodes de la classe sont ajoutées au champ "prototype" de cette fonction.

Création d'un objet: comment cela marche ?

On peut écrire le code de new en JavaScript. C'est Object.create(fun.prototype) + fun.apply(...).

La notation "class"

La notation est un peu plus verbeuse que la notation classique, donc quel est l'intérêt d'introduire cette nouvelle notation ?

Permet de regrouper dans un même endroit l'initialisation et la manipulation d'un type nommé

La notion de classe existe déjà dans plusieurs autres languages (C++, Java, Swift, Rust) et est donc mieux comprise que la notion de [Prototype] propre à JavaScript