javascript class
JavaScript

Javascript class : comment utiliser les classes et à quoi servent-elles?

Vaste sujet que les classes en javascript. Nous allons parler dans cet article de class, un sujet bien particulier en javascript, car il ne s’agit pas des mêmes classes qu’en back-end. Si vous avez des bases de back-end, certains termes vont vous être familiers.

Déclaration de classes

Les classes sont apparues en ES6 (EcmaScript 2015). Comme je le disais en introduction, il ne s’agit pas vraiment de classes comme on pourrait le voir en back-end (Java, Python, C#, …).

class Pokemon {
  constructor(name, type) {
    this.name = name;
    this.type = type;
  }
}

A savoir que les classes en Javascript sont des fonctions. Juste que les fonctions et la gestion des prototypes en javascript est tellement pourrie, qu’ils ont décidé de rajouter les class en ES6 pour simplifier tout ça.

constructor et méthodes

Constructor

Comme dans toutes bonnes classes, il faut utiliser un constructor. Ce constructor va permettre de faire un new pour créer notre instance d’objet. Nous avons vu dans le chapitre précédent, la déclaration de classe. Elle n’est qu’une définition de la classe mais notre objet n’est pas créé. L’instance d’une classe est la “création” d’un objet de la classe qu’on appelle avec new . Voyons une exemple directement :

class Pokemon { // définition de ma classe Pokemon
  constructor(name, type) {
    this.name = name;
    this.type = type;
  }
}

let pikachu = new Pokemon("Pikachu","electrique"); // instantiation de ma variable pikachu comme un objet de la classe pokemon

A noter qu’il n’est pas possible d’instancier un objet de la classe pokemon au dessus de cette même définition, vous aurez une reference error.

Propriétés

Une classe peut avoir des propriétés dans notre exemple précédent, la classe Pokemon a deux propriétés :

  • name
  • type

A noter que les propriétés sont instanciées dans le constructor.

Méthodes

Une classe peut avoir des méthodes. Imaginons que nous voulons gérer les attaques de notre pokemon. Nous allons définir des méthodes qui ne sont que des fonctions liées à notre classe Pokemon.

class Pokemon { // définition de ma classe Pokemon
  constructor(name, type) {
    this.name = name;
    this.type = type;
  }
  move(attaque){
    console.log(this.name + " attaque " + attaque);
  }
}

let pikachu = new Pokemon("Pikachu","electrique");
pikachu.move("éclair"); // affiche dans la console Pikachu attaque éclair

Ceci est une bonne introduction aux classes, à ses propriétés et aux méthodes associées. Il nous reste beaucoup de choses à connaître sur les classes, notamment extends qui fera l’objet d’un autre article.

J’espère que cet article vous a plu.

Si vous voulez aller plus loin dans votre apprentissage en javascript, je ne peux que vous conseiller de lire cet article :
http://pierreterrat.com/javascript-:-le-guide-ultime-pour-bien-commencer-a-apprendre/

Beaucoup d’efforts et de temps sont passés pour vous fournir du contenu de qualité, merci de partager et de commenter cet article pour faire vivre ce blog.

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *