Objet JavaScript
Tout en JavaScript est un objet : chaînes, nombres, tableaux, fonctions...
De plus, JavaScript permet des objets personnalisés.
Tout est un objet
JavaScript fournit plusieurs objets intégrés, tels que String, Date, Array, etc. Les objets ne sont que des types de données spéciaux dotés de propriétés et de méthodes.
Boolean peut être un objet.
Le type de numéro peut être un objet.
Une chaîne peut aussi être un objet
La date est un objet
Mathématiques et régularité Une expression est aussi un objet
Un tableau est un objet
Même une fonction peut être un objet
Objet JavaScript
L'objet est juste un type spécial de données. Les objets ont des propriétés et des méthodes.
Accéder aux propriétés d'un objet
Les propriétés sont des valeurs associées à un objet.
La syntaxe pour accéder aux propriétés des objets est :
Cet exemple utilise la propriété length de la chaîne object. Obtenez la longueur de la chaîne :
var x=message.length;
Après le code ci-dessus. est exécuté, x La valeur de sera :
Méthodes pour accéder à un objet
Les méthodes sont des actions qui peut être effectué sur un objet.
Vous pouvez appeler des méthodes avec la syntaxe suivante :
Cet exemple utilise l'objet String La méthode toUpperCase() pour convertir du texte en majuscules :
var x=message.toUpperCase();
Une fois le code ci-dessus exécuté, la valeur de JavaScript vous permet de définir et de créer vos propres objets.
Définir et créer une instance de l'objet
Utiliser fonctions pour définir l'objet, puis crée une nouvelle instance de l'objet
- Création d'une instance directe Cet exemple crée une nouvelle instance de l'objet et ajoute quatre Attributs :
Instance
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> </head> <body> <script> var person=new Object(); person.firstname="John"; person.lastname="Doe"; person.age=50; person.eyecolor="blue"; document.write(person.firstname + " is " + person.age + " years old."); </script> </body> </html>
Exécuter l'instance»
Cliquez sur le bouton « Exécuter l'instance » pour afficher l'instance en ligne instance
Syntaxe alternative (utilisant des littéraux d'objet) :
Instance<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>
<script>
person={firstname:"John",lastname:"Doe",age:50,eyecolor:"blue"}
document.write(person.firstname + " is " + person.age + " years old.");
</script>
</body>
</html>Exécuter l'instance »Cliquez sur le bouton « Exécuter l'instance » pour afficher l'instance en ligne
Utiliser le constructeur d'objet
Cet exemple utilise des fonctions pour construire des objets :
Instance
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>
<script>
function person(firstname,lastname,age,eyecolor){
this.firstname=firstname;
this.lastname=lastname;
this.age=age;
this.eyecolor=eyecolor;
}
myFather=new person("John","Doe",50,"blue");
document.write(myFather.firstname + " is " + myFather.age + " years old.");
</script>
</body>
</html>Exécuter Instance»
Cliquez sur le bouton « Exécuter l'instance » pour afficher l'instance en ligne
En JavaScript, cela pointe généralement vers la fonction que nous exécutons, ou vers la fonction à laquelle la fonction appartient. Objets (Runtime)
Création d'instances d'objet JavaScript
Une fois que vous avez un constructeur d'objet, vous pouvez créer une nouvelle instance d'objet, comme ceci :
var maMère=nouvelle personne("Sally","Rally",48,"vert");
Ajout de propriétés aux objets JavaScript
Vous pouvez ajouter de nouvelles propriétés à un objet existant en attribuant une valeur à l'objet :
En supposant que personObj existe déjà - vous pouvez Il ajoute ces nouveaux attributs : prénom, nom, âge et couleur des yeux :
person.lastname="Doe";
person.age=30 ;
person.eyecolor="blue";
x=person.firstname;
TAprès l'exécution du code ci-dessus, la valeur de x sera :
Ajout de méthodes aux objets JavaScript
Les méthodes ne sont rien de plus que des fonctions attachées à un objet.
Méthodes d'objets définies à l'intérieur de la fonction constructeur :
function person(firstname,lastname,age,eyecolor)
{
this.firstname=firstname;
this.lastname=lastname;
this.age=age;
this.eyecolor=eyecolor;
this.changeName=changeName;
function changeName(name)
{
this.lastname=name;
}
}changeName() La valeur du nom de la fonction est attribuée à la propriété lastname de la personne.
Instance
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>
<script>
function person(firstname,lastname,age,eyecolor){
this.firstname=firstname;
this.lastname=lastname;
this.age=age;
this.eyecolor=eyecolor;
this.changeName=changeName;
function changeName(name){
this.lastname=name;
}
}
myMother=new person("Sally","Rally",48,"green");
myMother.changeName("Doe");
document.write(myMother.lastname);
</script>
</body>
</html>Exécuter l'instance»
Cliquez sur le bouton « Exécuter l'instance » pour afficher l'instance en ligne
Classes JavaScript
JavaScript est un langage orienté objet, mais JavaScript n'utilise pas de classes.
En JavaScript, les classes ne sont pas créées, ni les objets créés à partir de classes (comme dans d'autres langages orientés objet).
JavaScript est basé sur des prototypes et non sur des classes.
JavaScript for...in loop
L'instruction JavaScript for...in parcourt les propriétés d'un objet.
Syntaxe
for (variable in object)
{
执行的代码……
}Remarque : Le bloc de code dans la boucle for...in sera exécuté une fois pour chaque attribut.
Instance
Parcourez les propriétés de l'objet :
Instance
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>
<p>点击下面的按钮，循环遍历对象 "person" 的属性。</p>
<button onclick="myFunction()">点击这里</button>
<p id="demo"></p>
<script>
function myFunction(){
var x;
var txt="";
var person={fname:"Bill",lname:"Gates",age:56};
for (x in person){
txt=txt + person[x];
}
document.getElementById("demo").innerHTML=txt;
}
</script>
</body>
</html>Exécuter l'instance»
Cliquez sur le bouton « Exécuter l'instance » pour afficher l'instance en ligne
