Les objets JavaScript sont des données avec des propriétés et des méthodes.
Objets, propriétés et méthodes dans la vraie vie
Dans la vraie vie, une voiture est un objet.
L'objet a ses propriétés, telles que le poids et la couleur, etc., et les méthodes incluent le démarrage et l'arrêt, etc. :
Toutes les voitures ont ces méthodes, mais le temps qu'elles sont exécutés est différent. Toutes les voitures ont ces attributs, mais les attributs de chaque voiture sont différents.
Objets JavaScript
En JavaScript, presque tout est un objet.
En JavaScript, les objets sont très importants Lorsque vous comprenez les objets, vous pouvez comprendre JavaScript.
Vous avez découvert l'affectation de variables JavaScript.
Le code suivant définit la valeur de la variable car sur "Fiat":
var car = "Fiat";
objet Également une variable, mais un objet peut contenir plusieurs valeurs (plusieurs variables).
var car = {type:"Fiat", model:500, color:"white"};
Dans l'exemple ci-dessus, 3 valeurs (" Fiat ", 500, "blanc") est affecté à la voiture variable.
Dans l'exemple ci-dessus, 3 variables (type, modèle, couleur) sont affectées à la variable voiture.
Astuce : Les objets JavaScript sont des conteneurs pour les variables.
Définition d'objet
Vous pouvez utiliser des caractères pour définir et créer des objets JavaScript :
Exemple
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> </head> <body> <p>创建 JavaScript 对象。</p> <p id="demo"></p> <script> var person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"}; document.getElementById("demo").innerHTML = person.firstName + " 现在 " + person.age + " 岁."; </script> </body> </html>
Exécutez le programme et essayez-le
Définissez des objets JavaScript pour s'étendre sur plusieurs lignes, les espaces et les sauts de ligne ne sont pas nécessaires :
Exemple
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> </head> <body> <p>创建 JavaScript 对象。</p> <p id="demo"></p> <script> var person = { firstName : "John", lastName : "Doe", age : 50, eyeColor : "blue" }; document.getElementById("demo").innerHTML = person.firstName + " 现在 " + person.age + " 岁。"; </script> </body> </html>
Exécutez le programme et essayez-le
Propriétés des objets
On peut dire que "les objets JavaScript sont des conteneurs de variables".
Cependant, nous considérons généralement « les objets JavaScript comme des conteneurs de paires clé-valeur ».
Les paires clé-valeur sont généralement écrites sous la forme nom : valeur (la clé et la valeur sont séparées par deux points).
Les paires clé-valeur dans les objets JavaScript sont souvent appelées propriétés d'objet.
Astuce : Les objets JavaScript sont des conteneurs pour les variables de propriété.
La paire clé-valeur de l'objet s'écrit comme :
Tableau associatif en PHP
Dictionnaire en Python
Table de hachage en C
Carte de hachage en Java
Tables de hachage en Ruby et Perl
Accès aux propriétés des objets
Vous pouvez accédez aux propriétés de l'objet de deux manières :
Méthode 1
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> </head> <body> <p> 有两种方式可以访问对象属性: </p> <p> 你可以使用 .property 或 ["property"]. </p> <p id="demo"></p> <script> var person = { firstName : "John", lastName : "Doe", id : 5566 }; document.getElementById("demo").innerHTML = person.firstName + " " + person.lastName; </script> </body> </html>
Exécutez le programme pour l'essayer
Méthode 2
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> PHP中文网</title> </head> <body> <p> 有两种方式可以访问对象属性: </p> <p> 你可以使用 .property 或 ["property"]。 </p> <p id="demo"></p> <script> var person = { firstName: "John", lastName : "Doe", id : 5566 }; document.getElementById("demo").innerHTML = person["firstName"] + " " + person["lastName"]; </script> </body> </html>
Exécutez le programme pour essayez-le
Accès aux méthodes objet
Vous pouvez créer des méthodes objet en utilisant la syntaxe suivante :
methodName : function() { lignes de code }
Vous pouvez accéder aux méthodes objet en utilisant la syntaxe suivante :
objectName.methodName()
Habituellement, fullName() est utilisé comme méthode de l'objet personne et fullName est utilisé comme propriété.
Il existe de nombreuses façons de créer, utiliser et modifier des objets JavaScript.
Il existe également de nombreuses façons de créer, utiliser et modifier des propriétés et des méthodes.