Objets JavaScript

véhicule, propriété et méthode réelle, propriété et méthode

Dans la vie réelle, un véhicule est unobjet

Les véhicules ont des caractéristiques telles que le poids et la couleur,propriétéet des méthodes telles que démarrer et arrêter,méthode

objet propriété méthode

car.name = porsche

car.model = 911

car.length = 4499mm

car.color = white

car.start()

car.drive()

car.brake()

car.stop()

Tous les véhicules ont les mêmespropriétéen commun, mais les valeurs des propriétés varient d'un véhicule à l'autre.

Tous les véhicules ont desméthodemais les méthodes sont exécutées à différents moments.

Objets JavaScript

Vous avez appris auparavant que les variables JavaScript sont des conteneurs de valeurs de données.

Ce code assigne unevaleur unique(porsche) est assigné à la variable nommée carvariable

var car = "porsche";

Essayez-le vous-même

Les objets sont également des variables, mais ils contiennent de nombreuses valeurs.

Ce code assignevaleurs multiples(porsche, 911, white) est assigné à la variable nommée carvariable

var car = {type:"porsche", model:"911", color:"white"};

Essayez-le vous-même

Les valeurs sontnom:valeurmanière à deux colonnes (le nom et la valeur sont séparés par un deux-points).

Les objets JavaScript sont écrits envaleur nomméeun conteneur.

propriété de l'objet

Les paires nom:valeur des objets JavaScript sont appeléespropriété

var person = {firstName:"Bill", lastName:"Gates", age:62, eyeColor:"blue"};
propriété valeur de propriété
firstName Bill
lastName Gates
age 62
eyeColor blue

méthode de l'objet

L'objet peut également avoirméthode

Les méthodes sont exécutées sur l'objetaction

Les méthodes sontDéfinition de la fonctionest stockée dans une propriété.

propriété valeur de propriété
firstName Bill
lastName Gates
age 62
eyeColor blue
fullName function() {return this.firstName + " " + this.lastName;}

La méthode est stockée comme une propriété.

Instance

var person = {
  firstName: "Bill",
  lastName : "Gates",
  id       : 678,
  fullName : function() {
    return this.firstName + " " + this.lastName;
  }
};

mot-clé this

Dans la définition de la fonction,this Référence le propriétaire de la fonction.

Dans l'exemple ci-dessus,this Se réfère à "possédant" la fonction fullName Objet person

En d'autres termes,this.firstName Signifie Objet thisla propriété firstName.

Veuillez consulter Mot-clé this en JSDans ce chapitre, vous apprendrez davantage sur le mot-clé this.

Définition de l'objet

Nous avons défini (créé) un objet JavaScript :

Instance

var person = {firstName:"Bill", lastName:"Gates", age:62, eyeColor:"blue"};

Essayez-le vous-même

Les espaces et les retours chariot sont autorisés. La définition de l'objet peut s'étendre sur plusieurs lignes :

Instance

var person = {
    firstName:"Bill",
    lastName:"Gates",
    age:50,
    eyeColor:"blue"
};

Essayez-le vous-même

Accéder à la propriété de l'objet

Vous pouvez accéder aux propriétés de deux manières :

objectName.propertyName

ou

objectName["propertyName"]

Exemple 1

person.lastName;

Essayez-le vous-même

Exemple 2

person["lastName"];

Essayez-le vous-même

Accéder à la méthode de l'objet

Vous pouvez accéder aux méthodes des objets avec la syntaxe suivante :

objectName.methodName())

Instance

name = person.fullName();

Essayez-le vous-même

Si vousSans utiliser () Accéder à la méthode fullName, cela renverraDéfinition de la fonction

Instance

name = person.fullName;

Essayez-le vous-même

Les méthodes sont en réalité stockées sous forme de valeurs d'attributs des définitions de fonctions.

Ne déclarez pas les chaînes de caractères, les nombres et les valeurs booléennes sous forme d'objets !

Si vous déclarez une variable JavaScript avec le mot-clé "new", cette variable sera créée sous forme d'objet :

var x = new String();        // Déclarer x comme objet String
var y = new Number();        // Déclarer y comme objet Number
var z = new Boolean();       // Déclarer z comme objet Boolean

Évitez les objets de chaîne, de nombre ou de logique. Ils ajoutent de la complexité au code et ralentissent l'exécution.

Évitez les objets de chaîne, de nombre ou de logique. Ils ajoutent de la complexité au code et ralentissent l'exécution.

Vous apprendrez plus sur les objets dans les chapitres ultérieurs de ce tutoriel.

livres de complément Objets JavaScriptPour plus d'informations sur

Technologie orientée objet ECMAScript
Pour plus d'informations sur les connaissances, veuillez lire le contenu pertinent du tutoriel avancé JavaScript :
Application d'objet ECMAScript
Cette section présente brièvement les termes de la technologie orientée objet, les exigences des langages orientés objet et la composition des objets.
Types d'objet ECMAScript
Cette section présente les trois types d'objets ECMAScript : les objets locaux, les objets intégrés et les objets hôte, et fournit des liens vers les manuels de référence pertinents.
Portée d'objet ECMAScript
Cette section explique la portée ECMAScript et le mot-clé this.
Définition de classes ou d'objets ECMAScript
Cette section explique en détail diverses méthodes de création d'objets ou de classes ECMAScript.
Modification d'objets ECMAScript
Cette section explique comment modifier un objet en créant de nouvelles méthodes ou en redéfinissant des méthodes existantes.