Maison  >  Article  >  interface Web  >  Une analyse approfondie du concept d'objet en programmation JavaScript_Connaissances de base

Une analyse approfondie du concept d'objet en programmation JavaScript_Connaissances de base

WBOY
WBOYoriginal
2016-05-16 15:35:411108parcourir

Tout en JavaScript est un objet : chaînes, nombres, tableaux, fonctions...
De plus, JavaScript autorise les 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.

  • Le type booléen 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
  • Les mathématiques et les expressions régulières sont aussi des objets
  • Un tableau est un objet
  • Même les fonctions peuvent être des objets

Objet JavaScript

Les objets ne sont qu'un type particulier de données. Les objets ont des propriétés et des méthodes.
Accéder aux propriétés d'un objet
Les attributs sont des valeurs associées aux objets.
La syntaxe pour accéder aux propriétés des objets est :

objectName.propertyName


Cet exemple utilise la propriété length de l'objet String pour obtenir la longueur de la chaîne :

var message="Hello World!";
var x=message.length;


Une fois le code ci-dessus exécuté, la valeur de x sera :

12

Méthodes pour accéder aux objets
Les méthodes sont des actions pouvant être effectuées sur un objet.
Vous pouvez appeler des méthodes avec la syntaxe suivante :

objectName.methodName()


Cet exemple utilise la méthode toUpperCase() de l'objet String pour convertir le texte en majuscules :

var message="Hello world!";
var x=message.toUpperCase();


Une fois le code ci-dessus exécuté, la valeur de x sera :

HELLO WORLD!

Créer un objet JavaScript
JavaScript vous permet de définir et de créer vos propres objets.
Il existe deux manières différentes de créer de nouveaux objets :

  1. Définir et créer des instances d'objets
  2. Utilisez des fonctions pour définir des objets, puis créez de nouvelles instances d'objet

Créer une instance directe
Cet exemple crée une nouvelle instance de l'objet et lui ajoute quatre propriétés :
Exemple

person=new Object();
person.firstname="John";
person.lastname="Doe";
person.age=50;
person.eyecolor="blue";


Syntaxe alternative (en utilisant des littéraux d'objet) :
Exemple

person={firstname:"John",lastname:"Doe",age:50,eyecolor:"blue"};


Utiliser le constructeur d'objet
Cet exemple utilise des fonctions pour construire des objets :
Exemple

function person(firstname,lastname,age,eyecolor)
{
this.firstname=firstname;
this.lastname=lastname;
this.age=age;
this.eyecolor=eyecolor;
}

En JavaScript, cela pointe généralement vers la fonction elle-même que nous exécutons, ou vers l'objet auquel appartient la fonction (runtime)
Créer une instance d'objet JavaScript
Une fois que vous avez le constructeur d'objet, vous pouvez créer de nouvelles instances d'objet comme ceci :

var myFather=new person("John","Doe",50,"blue");
var myMother=new person("Sally","Rally",48,"green");

Ajouter des 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 y ajouter ces nouvelles propriétés : prénom, nom, âge et couleur des yeux :

person.firstname="John";
person.lastname="Doe";
person.age=30;
person.eyecolor="blue";

x=person.firstname;


Une fois le code ci-dessus exécuté, la valeur de x sera :

John

Ajouter des méthodes aux objets JavaScript
Les méthodes ne sont rien de plus que des fonctions attachées à un objet.
Définissez les méthodes objet dans 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 à l'attribut lastname de la personne.
Vous pouvez maintenant l'essayer :

myMother.changeName("Doe");

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn