Maison > interface Web > js tutoriel > Explication détaillée des attributs de données et des instances d'attributs d'accesseur dans les objets Javascript

Explication détaillée des attributs de données et des instances d'attributs d'accesseur dans les objets Javascript

伊谢尔伦
Libérer: 2017-05-30 11:40:09
original
1760 Les gens l'ont consulté

Les propriétés des objets dans ES5 peuvent être divisées en deux types : les « propriétés des données » et les « propriétés des accesseurs ».

Les attributs de données sont généralement utilisés pour stocker des valeurs de données. Les attributs d'accesseur correspondent aux opérations set/get et ne peuvent pas stocker directement les valeurs de données.

Caractéristiques des attributs de données : valeur, inscriptible, énumérable, configurable.

Explication : configurable : vrai/faux, si l'attribut peut être supprimé par suppression, si les caractéristiques de l'attribut peuvent être modifiées, si l'attribut peut être modifié en tant qu'attribut accesseur, la valeur par défaut est false ;

enumerable : true/false, si elle peut être renvoyée via une boucle for in, la valeur par défaut est false

writable : true/false, si la valeur du l'attribut peut être modifié, la valeur par défaut est fausse ;

valeur : non définie, définissez la valeur de l'attribut, la valeur par défaut est non définie.

Caractéristiques des propriétés de l'accesseur : set, get, énumérable, configurable.

Explication : configurable : vrai/faux, si l'attribut peut être supprimé par suppression, si les caractéristiques de l'attribut peuvent être modifiées, si l'attribut peut être modifié en tant qu'attribut accesseur, la valeur par défaut est false ;

enumerable : true/false, s'il peut être renvoyé via une boucle for in, la valeur par défaut est false

set : function, la fonction appelée lors de la lecture de l'attribut ; value;

get : fonction, modifier Fonction appelée lorsque la valeur de la propriété est passée.

Pour ajouter des propriétés à un objet ou modifier les caractéristiques d'une propriété existante, utilisez la méthode Object.defineProperty() ou Object.defineproperties() ;

Object.defineProperty(object, propertyname, descriptor ):

Explication du paramètre : object : l'objet dont les attributs doivent être ajoutés ou modifiés ;

propertyname : le nom de l'attribut, format de chaîne

descripteur : description ; de l'attribut, la définition des attributs de données ou les caractéristiques des propriétés de l'accesseur.

Exemple d'analyse :

Attributs des données :

var emp = {
 
name:'tom'
 
};
   
 
Object.defineProperty(emp,'name',{
 
writable:false
 
});
 
emp.name = 'jery';
console.log(emp.name);//输出tom,因为已经设置了writable为false
 
 
Object.defineProperty(emp,'age',{
 
configurable:false,
 
writable:true,
 
value:22
 
});
 
console.log(emp.age);//输出22,因为设置了value为22
 
emp.age = 25;
 
console.log(emp.age);//输出25,设置了writable为true
 
delete emp.age;
 
console.log(emp.age);//输出25,设置了configurable为false,此属性删除不了
Copier après la connexion

Propriétés des accesseurs :

var emp ={
 
_name:'tom',
 
_age:20
 
};
 
  
Object.defineProperty(emp,'name',{
 
get:function(){
 
return this._name;
 
}
 
});
 
console.log(emp.name);//输出tom,由get方法返回_name的值
 
emp.name = 'jery';
 
console.log(emp.name);//输出tom,没有set方法,修改不了_name的值
 
   
Object.defineProperty(emp,'age',{
 
configurable:true,
 
get:function(){
 
 return this._age;
 
}
 
set:function(age){
 
this._age = age;
 
}
 
});
 
emp.age = 25;
console.log(emp.age)//输出25,emp.age=25是使用set方法将25赋值给_age,emp.age是使用get方法将_age的读取出来 
delete emp.age; 
console.log(emp.age);//输出undefined,configurable为true,可以使用delete方法将emp.age属性删除
Copier après la connexion

Remarque : L'attribut accesseur peut jouer un très bon rôle de protection lorsqu'il n'y a qu'une méthode get, elle ne peut être que lue mais pas écrite ; à l'inverse, lorsqu'il n'y a qu'une méthode set, elle ne peut être qu'écrite mais pas lue

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!

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