Maison > interface Web > js tutoriel > Explication détaillée des setters et getters JavaScript

Explication détaillée des setters et getters JavaScript

小云云
Libérer: 2018-01-05 13:28:01
original
3051 Les gens l'ont consulté

Cet article présente principalement en détail les méthodes setter et getter de JavaScript. Il a une certaine valeur de référence. Les amis intéressés peuvent s'y référer.

Je n'ai jamais utilisé les méthodes setter et getter de Javascript auparavant lors de l'écriture de projets, c'est donc un concept qui doit être compris Aujourd'hui, j'ai lu ce point de connaissance dans un livre, et il est encore vague. pour l'étudier ;

Les propriétés d'un objet Javascript sont composées d'un nom, d'une valeur et d'un ensemble de caractéristiques. Alors d'abord, jetons un coup d'œil aux deux propriétés de l'objet :

propriétés de données, que nous utilisons souvent et que nous devrions connaître
propriétés d'accesseur, également appelées propriétés d'accesseur

Que sont les propriétés des accesseurs ? C'est un ensemble de fonctions qui obtiennent et définissent des valeurs. Dans ECMAScript5, les valeurs des propriétés peuvent être définies à l'aide d'une ou deux méthodes, les deux méthodes sont des getters et des setters, par conséquent, les propriétés définies par les getters et les setters sont appelées propriétés d'accesseur ;


var o = {
  get val(){
    /*函数体*/
    return ;
  },
  set val(n){
    /*函数体*/
  }
}
Copier après la connexion

Ce qui précède est le moyen le plus simple de définir un attribut d'accesseur. On peut voir que les méthodes getter et setter sont en fait des fonctions qui remplacent la fonction.


var o = {
  a:3,
  get val(){
    return Math.pow(this.a,2);
  }
}

console.log(o.val);//9
o.val = 100;
console.log(o.val);//9
Copier après la connexion

La méthode getter n'a pas de paramètres et renvoie une valeur ; lorsque la méthode getter est définie séparément, elle ne peut obtenir que la valeur de l'attribut et ne peut pas modifier son attribut défini. value. , assurant la sécurité des données ;


var o = {
  a:3,
  set val(n){
    this.a = n;
  }
}

console.log(o.val);//undefined
Copier après la connexion

La méthode setter a des paramètres et aucune valeur de retour lorsque la méthode setter est définie séparément, les attributs ne peuvent pas être lus Value ;


var o ={
  a:3,
  get val(){
    return Math.pow(this.a,n);
  },
  set val(n){
    this.a = Math.max(this.a,n);
  }
}

console.log(o.a);//3
console.log(o.val);//9
o.val = 10;
console.log(o.a);//10
console.log(o.val);//100
Copier après la connexion

Comme le montre le code ci-dessus, ceci fait référence à son objet (c'est-à-dire le "o" dans le code

<) ; 🎜>

var o ={
   a:3,
  get val(){
    return Math.pow(this.a,n);
  },
  set val(n){
    this.a = Math.max(this.a,n);
  }
}

o.val = 10;
var foo = Object.create(o);
console.log(foo.val);//10
foo.val = 9;
console.log(foo.val);//10
Copier après la connexion
De plus, les propriétés des accesseurs peuvent également être héritées

Recommandations associées :

Introduction de base aux getters et setters en Javascript

Pourquoi n'est-il pas bon d'utiliser des getters et des setters en JavaScript ?

Exemple de partage de code d'implémentation de getter/setter en JavaScript

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!

É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