Maison > interface Web > js tutoriel > Compréhension approfondie des objets en JavaScript_Basic knowledge

Compréhension approfondie des objets en JavaScript_Basic knowledge

WBOY
Libérer: 2016-05-16 15:56:47
original
1146 Les gens l'ont consulté

JavaScript est un langage de programmation orienté objet (POO). Un langage de programmation peut être appelé orienté objet et offre quatre fonctionnalités de base aux développeurs :

  • Encapsulation - stocke les informations pertinentes, qu'il s'agisse de données, de méthodes ou d'objets
  • Agrégation - Stockez un objet dans un autre objet
  • Héritage - la capacité d'une classe à dépendre d'une ou plusieurs autres classes pour certaines de ses propriétés et méthodes
  • Polymorphisme - écriture de fonctions ou de méthodes qui fonctionnent de différentes manières

Les objets sont constitués de propriétés. Si une propriété contient une fonction, elle est considérée comme une méthode d’un objet, sinon la propriété est considérée comme une propriété.
Propriétés de l'objet :

Les propriétés d'un objet peuvent appartenir à l'un des trois types de données de base, ou à n'importe quel type de données abstrait, tel qu'un autre objet. Les propriétés d'un objet sont généralement des variables utilisées en interne par les méthodes de l'objet, mais peuvent également être des variables utilisées globalement et visibles sur toute la page.

La syntaxe pour ajouter des attributs est :

objectName.objectProperty = propertyValue;

Copier après la connexion

Exemple :

Ce qui suit est un exemple simple pour illustrer comment utiliser la propriété "title" de l'objet fichier pour obtenir le titre du document :

var str = document.title;

Copier après la connexion


Méthodes objets :

Les méthodes indiquent à un objet de faire quelque chose. Il y a peu de différence entre une fonction et une méthode, sauf qu'une instruction de fonction est une unité indépendante et que la méthode est attachée à l'objet et peut être référencée via ce mot-clé.

Les méthodes peuvent être utiles pour tout, depuis l'affichage du contenu d'un objet à l'écran jusqu'à l'exécution d'opérations mathématiques complexes sur un ensemble local de propriétés et de paramètres.
Exemple :

Voici un exemple simple pour illustrer comment utiliser la méthode write() de l'objet document pour écrire n'importe quel contenu dans le document :

document.write("This is test");

Copier après la connexion


Objets définis par l'utilisateur :

Tous les objets définis par l'utilisateur et les objets intégrés sont appelés descendants d'objets.
nouvel opérateur :

L'opérateur new est utilisé pour créer des instances d'objets. Pour créer un objet, l'opérateur new est suivi de la méthode constructeur.

Dans l'exemple suivant, les méthodes constructeur Object(), Array() et Date(). Ces constructeurs sont des fonctions JavaScript intégrées.

var employee = new Object();
var books = new Array("C++", "Perl", "Java");
var day = new Date("August 15, 1947");

Copier après la connexion


Constructeur Object() :

Constructor est une fonction utilisée pour créer et initialiser des objets. JavaScript fournit un constructeur spécial appelé Object() pour construire des objets. La valeur de retour de la construction Object() est affectée à une variable.

La variable contient une référence au nouvel objet. Les propriétés affectées à cet objet sont invariantes et ne sont pas définies à l'aide du mot-clé var.
Exemple 1 :

Cet exemple montre comment créer un objet :

<html>
<head>
<title>User-defined objects</title>
<script type="text/javascript">
var book = new Object();  // Create the object
  book.subject = "Perl"; // Assign properties to the object
  book.author = "Mohtashim";
</script>
</head>
<body>
<script type="text/javascript">
  document.write("Book name is : " + book.subject + "<br>");
  document.write("Book author is : " + book.author + "<br>");
</script>
</body>
</html>

Copier après la connexion


Exemple 2 :

Cet exemple montre comment créer un objet et une fonction définie par l'utilisateur. Ici, le mot-clé this est utilisé pour faire référence à l'objet qui a été passé à la fonction :

<html>
<head>
<title>User-defined objects</title>
<script type="text/javascript">
function book(title, author){
  this.title = title; 
  this.author = author;
}
</script>
</head>
<body>
<script type="text/javascript">
  var myBook = new book("Perl", "Mohtashim");
  document.write("Book title is : " + myBook.title + "<br>");
  document.write("Book author is : " + myBook.author + "<br>");
</script>
</body>
</html>

Copier après la connexion


Méthode de définition d'objet :

L'exemple précédent montre comment un constructeur crée un objet et attribue des propriétés. Cependant, nous devons utiliser la méthode d'allocation pour compléter la définition d'un objet.
Exemple :

Voici un exemple simple pour illustrer comment ajouter une fonction avec un objet :

<html>
<head>
<title>User-defined objects</title>
<script type="text/javascript">

// Define a function which will work as a method
function addPrice(amount){
  this.price = amount; 
}

function book(title, author){
  this.title = title; 
  this.author = author;
  this.addPrice = addPrice; // Assign that method as property.
}

</script>
</head>
<body>
<script type="text/javascript">
  var myBook = new book("Perl", "Mohtashim");
  myBook.addPrice(100);
  document.write("Book title is : " + myBook.title + "<br>");
  document.write("Book author is : " + myBook.author + "<br>");
  document.write("Book price is : " + myBook.price + "<br>");
</script>
</body>
</html>

Copier après la connexion


avec mot-clé :

Le mot-clé with est utilisé comme un raccourci pour faire référence aux propriétés ou aux méthodes d'un objet.

L'objet spécifié en paramètre devient l'objet par défaut pour la durée du bloc suivant. Les propriétés et méthodes des objets peuvent être trouvées sur des objets sans nom.
Grammaire

with (object){
  properties used without the object name and dot
}

Copier après la connexion

Exemple :

<html>
<head>
<title>User-defined objects</title>
<script type="text/javascript">

// Define a function which will work as a method
function addPrice(amount){
  with(this){
    price = amount; 
  }
}
function book(title, author){
  this.title = title; 
  this.author = author;
  this.price = 0;
  this.addPrice = addPrice; // Assign that method as property.
}
</script>
</head>
<body>
<script type="text/javascript">
  var myBook = new book("Perl", "Mohtashim");
  myBook.addPrice(100);
  document.write("Book title is : " + myBook.title + "<br>");
  document.write("Book author is : " + myBook.author + "<br>");
  document.write("Book price is : " + myBook.price + "<br>");
</script>
</body>
</html>

Copier après la connexion

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal