Qu'est-ce que le JavaScript orienté objet ? Comprendre les objets en js

Le contenu de cet article porte sur ce qu'est le JavaScript orienté objet ? La compréhension des objets en js a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer, j'espère que cela vous sera utile.

1. Orienté objet

Le symbole le plus fondamental du langage orienté objet est le concept de classe. Qu'est-ce qu'un cours ? Une classe est une collection contenant plusieurs propriétés et méthodes. Une instance d'une classe est un objet .
Pour des raisons historiques, le concept d'objets dans ECMAScript (ci-après dénommé JS) est différent des objets dans les langages basés sur les classes. ECMA-262 définit un objet comme « une collection non ordonnée d'attributs, dont les attributs peuvent contenir des valeurs, des objets ou des fonctions de base ».
Chaque objet est créé en fonction d'un type de référence.

2. Comprendre les objets

2.1. Il existe deux façons de créer des objets en JS :

// 第一种：创建Object实例
var person = new Object();
person.name = 'tom';
person.age = 20;
person.sayIt = function(){console.log(this.name, this.age)}

// 第二种：对象字面量值
var person = {
   name: 'tom',
   age: 20,
   sayIt: function(){console.log(this.name, this.age)}
}

Les objets créés dans les deux exemples ci-dessus sont les mêmes. et les méthodes.

2.2. Attributs de données et attributs d'accesseur

Les clés des objets JS (c'est-à-dire les attributs et méthodes tels que name et sayIt) sont divisées en deux types d'attributs : les données Propriétés et propriétés des accesseurs.

2.2.1. Attribut de données

L'attribut de données contient l'emplacement d'une valeur de données où la valeur peut être lue et écrite. Contient les 4 caractéristiques suivantes :

Configurable : Indique si delete peut supprimer l'attribut et si le type du descripteur d'attribut peut être modifié. La valeur par défaut est false Lorsque vous créez une instance sans spécifier cette valeur, elle sera par défaut true.
Enumerable : Indique si l'attribut est énumérable (for-in). La valeur par défaut est false Lorsque vous créez une instance sans spécifier cette valeur, elle sera par défaut true.
Writable : Indique si la valeur de l'attribut peut être modifiée. La valeur par défaut est false Lorsque vous créez une instance sans spécifier cette valeur, elle sera par défaut true.
Valeur : Représente la valeur de l'attribut. La valeur par défaut est indéfinie. Lors de la création d'une instance sans spécifier cette valeur, elle sera par défaut indéfinie.

Si vous créez une instance :

var person = {
    name: 'tom'
}

Les attributs de données Configurable, Enumerable et Writable du nom d'attribut de l'objet personne sont tous vrais, c'est-à-dire que l'attribut name peut être supprimé, énuméré et la valeur peut être réécrite. La valeur actuelle de l'attribut name est 'tom'.
Si vous souhaitez modifier l'attribut data d'un attribut, vous pouvez utiliser la méthode Object.defineProperty() fournie par ES5. Cette méthode peut également ajouter un nouvel attribut à l'objet. trois paramètres : l'objet cible, et Le nom de l'attribut à définir ou à modifier, l'attribut de données qui doit être défini ou modifié
Modifiez l'attribut de nom de l'instance de personne comme suit :

var person = {
    name: 'tom'
}
Object.defineProperty(person, 'name', {
    configurable: false,
    enumerable: false,
    writable: false,
    value: 1
})
console.log(person.name); // 1，name属性的值已修改为1

delete person.name; 
console.log(person.name); // 1, name属性依然存在

for(var i in person){
    console.log(i); // undefined，name属性不可枚举
}

person.name = 2; 
console.log(person.name); // 1，name的值依然为1，不可修改

Remarque : La méthode Object.defineProperty() est dans Après avoir défini configurable sur false, les caractéristiques autres que l'écriture ne peuvent pas être modifiées.

2.2.2. Propriétés de l'accesseur

La propriété de l'accesseur n'a aucune valeur de données et n'a que deux fonctions :

fonction getter pour obtenir des valeurs valides
fonction setter , Définition de valeurs valides

Une façon courante d'utiliser les propriétés de l'accesseur consiste à modifier d'autres propriétés en définissant la valeur d'une propriété. Les propriétés de l'accesseur incluent également 4 propriétés :

Configurable<.> : Indique si delete peut supprimer l'attribut et si le type du descripteur d'attribut peut être modifié. La valeur par défaut est false Lorsque vous créez une instance sans spécifier cette valeur, elle sera par défaut true.
Enumerable : Indique si l'attribut est énumérable (for-in). La valeur par défaut est false Lorsque vous créez une instance sans spécifier cette valeur, elle sera par défaut true.
Get : Fonction appelée lors de la lecture des attributs, la valeur par défaut est indéfinie.
Set : Fonction appelée lors de l'écriture des attributs, la valeur par défaut est indéfinie.

var book = {
    _year: 2004,
     edition: 1
};
Object.defineProperty(book, "year", {
     get: function(){
         return this._year;
     },
     set: function(newValue){
         if (newValue > 2004) {
             this._year = newValue;
             this.edition += newValue - 2004;
         }
     }
});
book.year = 2005;
console.log(book.edition); //2

Où year est l'attribut accesseur et _year est l'attribut data. Les valeurs Configurable et Enumerable de l'

année d'attribut d'accesseur ne sont pas définies, c'est donc faux, c'est-à-dire que l'année d'attribut d'accesseur ne peut pas être supprimée ou énumérée.

Vous pouvez lire les caractéristiques de la propriété via la méthode Object.getOwnPropertyDescriptor() :

var descriptor = Object.getOwnPropertyDescriptor(book, '_year'); 
console.log(descriptor.writable); // true
console.log(descriptor.configurable); // true

Résumé :

javasc a plusieurs objets Une instance d'une collection de propriétés et de méthodes. Ses propriétés sont divisées en deux types : les propriétés de données et les propriétés d'accesseur. Les propriétés de l'objet peuvent être lues et modifiées via diverses méthodes fournies par Object.

Recommandations associées :

Introduction à l'orientation objet dans JavaScript_js orienté objet

Objet Javascript orienté objet surcharge_js -orienté

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!