Objets JavaScript
Objets, propriétés et méthodes de la vie réelle
Dans la vraie vie, une voiture est un objet .
Une voiture a des propriétés comme le poids et la couleur, et des méthodes comme le démarrage et l'arrêt :
| Objet | Propriétés | Méthodes |
|---|---|---|
|
car.name = Fiat car.model = 500 car.weight = 850kg car.color = blanc |
car.start() car.drive() car.brake() car.stop() |
Toutes les voitures ont les mêmes propriétés , mais les valeurs des propriétés diffèrent d'une voiture à l'autre.
Toutes les voitures ont les mêmes méthodes , mais les méthodes sont exécutées à des moments différents .
Objets JavaScript
Vous avez déjà appris que les variables JavaScript sont des conteneurs pour les valeurs de données.
Ce code attribue une valeur simple (Fiat) à une variable nommée car :
let car = "Fiat";
Les objets sont aussi des variables. Mais les objets peuvent contenir de nombreuses valeurs.
Ce code attribue plusieurs valeurs (Fiat, 500, blanc) à une variable nommée car :
const car = {type:"Fiat", model:"500", color:"white"};
Les valeurs sont écrites sous forme de paires nom:valeur (nom et valeur séparés par deux points).
Il est courant de déclarer des objets avec le mot-clé const .
Apprenez-en plus sur l'utilisation de const avec des objets dans le chapitre : JS Const .
Définition d'objet
Vous définissez (et créez) un objet JavaScript avec un littéral d'objet :
Exemple
const person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};
Les espaces et les sauts de ligne ne sont pas importants. Une définition d'objet peut s'étendre sur plusieurs lignes :
Exemple
const person = {
firstName: "John",
lastName: "Doe",
age: 50,
eyeColor: "blue"
};
Propriétés de l'objet
Les paires name:values dans les objets JavaScript sont appelées properties :
| Propriété | Valeur de la propriété |
|---|---|
| Prénom | Jean |
| nom de famille | Biche |
| âge | 50 |
| couleur des yeux | bleu |
Accéder aux propriétés de l'objet
Vous pouvez accéder aux propriétés d'un objet de deux manières :
objectName.propertyName
ou
objectName["propertyName"]
Exemple 1
person.lastName;
Exemple2
person["lastName"];
Les objets JavaScript sont des conteneurs pour des valeurs nommées appelées propriétés.
Méthodes d'objet
Les objets peuvent aussi avoir des méthodes .
Les méthodes sont des actions qui peuvent être effectuées sur des objets.
Les méthodes sont stockées dans les propriétés en tant que définitions de fonction .
| Propriété | Valeur de la propriété |
|---|---|
| Prénom | Jean |
| nom de famille | Biche |
| âge | 50 |
| couleur des yeux | bleu |
| nom complet | function() {retourner this.firstName + " " + this.lastName ;} |
Une méthode est une fonction stockée en tant que propriété.
Exemple
const person = {
firstName: "John",
lastName : "Doe",
id : 5566,
fullName : function() {
return this.firstName + " " + this.lastName;
}
};
Le ce mot- clé
Dans une définition de fonction, thisfait référence au "propriétaire" de la fonction.
Dans l'exemple ci-dessus, thisest l' objet personne qui "possède" la
fullNamefonction.
En d'autres termes, this.firstNamedésigne la firstNamepropriété de cet objet .
En savoir plus sur le mot- thisclé à JS ce mot-clé .
Accéder aux méthodes d'objet
Vous accédez à une méthode objet avec la syntaxe suivante :
objectName.methodName()
Exemple
name = person.fullName();
Si vous accédez à une méthode sans les parenthèses (), elle retournera la définition de la fonction :
Exemple
name = person.fullName;
Ne déclarez pas les chaînes, les nombres et les booléens en tant qu'objets !
Lorsqu'une variable JavaScript est déclarée avec le mot-clé " new", la variable est créée en tant qu'objet :
x = new String(); // Declares x as a String object
y = new Number(); // Declares y as a Number object
z = new Boolean(); // Declares z as a Boolean object
Évitez les objets String, Numberet . BooleanIls compliquent votre code et ralentissent la vitesse d'exécution.
Vous en apprendrez plus sur les objets plus loin dans ce didacticiel.