Puisque vous avez posé une question similaire , allons-y étape par étape. C'est un peu plus long, mais cela peut vous faire gagner beaucoup plus de temps que j'ai passé à écrire ceci:
La propriété est une fonctionnalité POO conçue pour une séparation nette du code client. Par exemple, dans certaines boutiques en ligne, vous pourriez avoir des objets comme celui-ci:
function Product(name,price) {
this.name = name;
this.price = price;
this.discount = 0;
}
var sneakers = new Product("Sneakers",20); // {name:"Sneakers",price:20,discount:0}
var tshirt = new Product("T-shirt",10); // {name:"T-shirt",price:10,discount:0}
Ensuite, dans votre code client (l'e-shop), vous pouvez ajouter des réductions sur vos produits:
function badProduct(obj) { obj.discount+= 20; ... }
function generalDiscount(obj) { obj.discount+= 10; ... }
function distributorDiscount(obj) { obj.discount+= 15; ... }
Plus tard, le propriétaire de l'e-boutique pourrait se rendre compte que la remise ne peut pas être supérieure à 80%. Vous devez maintenant rechercher CHAQUE occurrence de la modification de la remise dans le code client et ajouter une ligne
if(obj.discount>80) obj.discount = 80;
Ensuite, le propriétaire de l'e-boutique peut encore modifier sa stratégie, comme "si le client est revendeur, la remise maximale peut être de 90%" . Et vous devez à nouveau effectuer le changement à plusieurs endroits et vous devez vous rappeler de modifier ces lignes chaque fois que la stratégie est modifiée. C'est une mauvaise conception. C'est pourquoi l' encapsulation est le principe de base de la POO. Si le constructeur était comme ça:
function Product(name,price) {
var _name=name, _price=price, _discount=0;
this.getName = function() { return _name; }
this.setName = function(value) { _name = value; }
this.getPrice = function() { return _price; }
this.setPrice = function(value) { _price = value; }
this.getDiscount = function() { return _discount; }
this.setDiscount = function(value) { _discount = value; }
}
Ensuite, vous pouvez simplement modifier les méthodes getDiscount( accesseur ) et setDiscount( mutator ). Le problème est que la plupart des membres se comportent comme des variables communes, seule la remise nécessite ici une attention particulière. Mais une bonne conception nécessite l'encapsulation de chaque membre de données pour que le code reste extensible. Vous devez donc ajouter beaucoup de code qui ne fait rien. C'est aussi une mauvaise conception, un anti- modèle passe- partout . Parfois, vous ne pouvez pas simplement refactoriser les champs en méthodes plus tard (le code de l'eshop peut devenir volumineux ou un code tiers peut dépendre de l'ancienne version), donc le passe-partout est moins mal ici. Mais encore, c'est mal. C'est pourquoi les propriétés ont été introduites dans de nombreuses langues. Vous pouvez conserver le code d'origine, il suffit de transformer le membre de la réduction en une propriété avecgetet setblocs:
function Product(name,price) {
this.name = name;
this.price = price;
//this.discount = 0; // <- remove this line and refactor with the code below
var _discount; // private member
Object.defineProperty(this,"discount",{
get: function() { return _discount; },
set: function(value) { _discount = value; if(_discount>80) _discount = 80; }
});
}
// the client code
var sneakers = new Product("Sneakers",20);
sneakers.discount = 50; // 50, setter is called
sneakers.discount+= 20; // 70, setter is called
sneakers.discount+= 20; // 80, not 90!
alert(sneakers.discount); // getter is called
Notez la dernière ligne avant: la responsabilité de la valeur de remise correcte a été déplacée du code client (définition de la boutique en ligne) à la définition du produit. Le produit est responsable de la cohérence de ses données membres. Une bonne conception est (grosso modo) si le code fonctionne de la même manière que nos pensées.
Tant de propriétés. Mais javascript est différent des langages orientés objet purs comme C # et code les fonctionnalités différemment:
En C # , la transformation des champs en propriétés est un changement radical , donc les champs publics doivent être codés en tant que propriétés implémentées automatiquement si votre code peut être utilisé dans un client compilé séparément.
En Javascript , les propriétés standard (membre de données avec getter et setter décrits ci-dessus) sont définies par le descripteur d'accesseur (dans le lien que vous avez dans votre question). Exclusivement, vous pouvez utiliser un descripteur de données (vous ne pouvez donc pas utiliser ie value et définir sur la même propriété):
- descripteur d'accesseur = get + set (voir l'exemple ci-dessus)
- get doit être une fonction; sa valeur de retour est utilisée pour lire la propriété; s'il n'est pas spécifié, la valeur par défaut est indéfinie , qui se comporte comme une fonction qui renvoie undefined
- set doit être une fonction; son paramètre est rempli de RHS lors de l'attribution d'une valeur à la propriété; s'il n'est pas spécifié, la valeur par défaut est indéfinie , qui se comporte comme une fonction vide
- descripteur de données = valeur + inscriptible (voir l'exemple ci-dessous)
- valeur par défaut non définie ; si accessible en écriture , configurable et énumérable (voir ci-dessous) est true, la propriété se comporte comme un champ de données ordinaire
- inscriptible - faux par défaut; si ce n'est pas vrai , la propriété est en lecture seule; la tentative d'écriture est ignorée sans erreur *!
Les deux descripteurs peuvent avoir ces membres:
- configurable - faux par défaut; si ce n'est pas vrai, la propriété ne peut pas être supprimée; la tentative de suppression est ignorée sans erreur *!
- énumérable - faux par défaut; si c'est vrai, il sera itéré dans
for(var i in theObject); s'il est faux, il ne sera pas réitéré, mais il est toujours accessible en tant que public
* sauf en mode strict - dans ce cas, JS arrête l'exécution avec TypeError sauf s'il est intercepté dans le bloc try-catch
Pour lire ces paramètres, utilisez Object.getOwnPropertyDescriptor().
Apprenez par l'exemple:
var o = {};
Object.defineProperty(o,"test",{
value: "a",
configurable: true
});
console.log(Object.getOwnPropertyDescriptor(o,"test")); // check the settings
for(var i in o) console.log(o[i]); // nothing, o.test is not enumerable
console.log(o.test); // "a"
o.test = "b"; // o.test is still "a", (is not writable, no error)
delete(o.test); // bye bye, o.test (was configurable)
o.test = "b"; // o.test is "b"
for(var i in o) console.log(o[i]); // "b", default fields are enumerable
Si vous ne souhaitez pas autoriser le client à coder de telles astuces, vous pouvez restreindre l'objet de trois niveaux de confinement:
- Object.preventExtensions (votreObjet) empêche l' ajout de nouvelles propriétés à votreObjet . Utilisez
Object.isExtensible(<yourObject>)pour vérifier si la méthode a été utilisée sur l'objet. La prévention est superficielle (lire ci-dessous).
- Object.seal (yourObject) comme ci-dessus et les propriétés ne peuvent pas être supprimées (définissent effectivement
configurable: falsetoutes les propriétés). UtilisezObject.isSealed(<yourObject>)pour détecter cette fonction sur l'objet. Le sceau est peu profond (lire ci-dessous).
- Object.freeze (yourObject) comme ci-dessus et les propriétés ne peuvent pas être modifiées (définit effectivement
writable: falsetoutes les propriétés avec un descripteur de données). La propriété inscriptible du Setter n'est pas affectée (car elle n'en a pas). Le gel est superficiel : cela signifie que si la propriété est Object, ses propriétés NE SONT PAS gelées (si vous le souhaitez, vous devez effectuer quelque chose comme "deep freeze", similaire au deep copy - clonage ). UtilisezObject.isFrozen(<yourObject>)pour le détecter.
Vous n'avez pas besoin de vous en soucier si vous écrivez juste quelques lignes amusantes. Mais si vous souhaitez coder un jeu (comme vous l'avez mentionné dans la question liée), vous devez vraiment vous soucier d'un bon design. Essayez de rechercher quelque chose sur Google sur les anti - modèles et l' odeur du code . Cela vous aidera à éviter des situations telles que "Oh, j'ai besoin de réécrire complètement mon code à nouveau!" , cela peut vous éviter des mois de désespoir si vous voulez beaucoup coder. Bonne chance.
