Objets JavaScript
- Page précédente Fonctions JS
- Page suivante Événements JS
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";
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"};
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"};
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" };
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;
Exemple 2
person["lastName"];
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();
Si vousSans utiliser () Accéder à la méthode fullName, cela renverraDéfinition de la fonction:
Instance
name = person.fullName;
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.
- Page précédente Fonctions JS
- Page suivante Événements JS