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

Compréhension approfondie des objets en JavaScript_Basic knowledge

WBOYoriginal: 2016-05-16 15:56:471123parcourir

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;

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;

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");

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");

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>

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>

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>

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
}

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>

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

Article précédent：Explication détaillée de l'utilisation de la boucle while dans les connaissances JavaScript_BasicArticle suivant：Explication détaillée de l'utilisation de la boucle while dans les connaissances JavaScript_Basic

Articles Liés

Voir plus