JavaScript - Object.defineProperties

Transcription

O b j e c t . d e f i n e P ro p e r t i e s
Object.defineProperties(obj , props)
O b j e c t . d e f i n e P ro p e r t y
Object.defineProperty (obj , prop , descriptor)
J AVA S C R I P T (Programmation Internet)
Po u r D é b u t a n t
J.B. Dadet DIASOLUKA Luyalu Nzoyifuanga
+243 - 851278216 - 899508675 - 995624714 - 902263541 - 813572818
La dernière révision de ce texte est disponible sur CD.
I.
Object . defineProperties
« Object . defineProperties ( ) », méthode de l’objet transcendant
« Object », permet de créer (définir) une ou plusieurs nouvelle(s) propriété(s), ou de modifier une ou plusieurs autres propriété préexistantes
d’un objet donné, en retournant l’objet modifié.
Syntaxe :
Object.defineProperties(obj, props)
« obj » : objet (soit-il vide) auquel on veut ajouter ou dont on veut modifier une ou plusieurs propriétés.
« props » encore un objet, dont les clés (membres ou éléments) sont les
attributs ou « descripteurs » (énumérables), des propriétés qu’on veut
modifier ou ajouter.
const obj = {};
Object.defineProperties(obj, {
property1: {
value: "prop1Value",
attributs
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-V
},
property2: {}
});
« Object . defineProperties ( ) » : version à deux arguments, le premier
argument étant l’objet en question, et le deuxième étant un objet qui renferme les propriétés à définir ou à redéfinir.
Les descripteurs (à définir ou à redéfinir) sont eux-mêmes des objets
pouvant être des « data descriptors » ou des « accessor descriptors ».
Ils doivent obligatoirement avoir les deux clés (membres ou éléments)
suivantes (REQUIRED keys) :
1. configurable : si « true », le type du descripteur de cette propriété peut être modifié [ses attributs value, writable, configurable, enumerable, set(), get()], et cette propriété peut être supprimée de l’objet.
Valeur par défaut = false.
2. enumerable : si « true », la propriété s’affiche lors d’une énumération des propriétés de l’objet, avec une boucle « for…in »
ou avec la méthode « Object . keys ».
Les deux clés suivantes des descripteurs sont optionnelles (OPTIONAL keys) :
3. value : la valeur associée à l’objet, celle qui est automatiquement
affichée quand on lit la valeur de l’objet, ou qu’on modifie lors
d’une affectation (toute valeur JavaScript valide : number, object,
function, etc.).
Par exemple avec
« console . log ( objet . property ) » ou
« objet . property = val ».
defineProperty, defineProperties
- 2/15 -
jeudi, 4. avril 2019
JavaScript Tome-V
Valeur par défaut = undefined.
4. writable : Si « true », on peut directement affecter une nouvelle
valeur à la propriété, avec un opérateur d’affectation.
5. get : Fonction jouant le rôle de « getter » pour la propriété. La
valeur qu’elle retourne est la valeur de la propriété. Valeur par
défaut = undefined.
6. set : Fonction jouant le rôle de « setter » pour la propriété. Son
unique argument est la nouvelle valeur à affecter à la propriété.
Valeur par défaut = undefined.
<script type="text/javascript"> "use strict";
const objet = {};
let r = Object.defineProperties(objet, {
property1: {
writable: true,
enumerable: false
}
,
property2: {
value: "prop2Value"
}
,
property3: {
writable: true,
configurable: true
}
});
console.log(r);
console.log(
objet.property1,
objet.property2,
- 3/15 -
JavaScript Tome-V
objet.property3);
</script>
- 4/15 -
II.
JavaScript Tome-V
Object . defineProperty
« Object . defineProperty ( ) », méthode de l’objet transcendant « Object », permet de créer (définir) une nouvelle propriété, ou de modifier
une autre propriété préexistante d’un objet donné, en retournant l’objet
modifié.
Syntaxe :
Object.defineProperty(obj, prop, descriptor)
« obj » : objet (soit-il vide) auquel on veut ajouter ou dont on veut modifier une ou plusieurs propriétés.
« prop » encore un objet, la propriété à ajouter ou à modifier, et dont
les clés (membres ou éléments) sont les attributs ou descripteurs de la
propriété.
« descriptor » descripteur de la propriété à ajouter ou à modifier.
« valeur de retour » : L’objet passé à la fonction.
Une façon de définir une propriété d’un objet, le descripteur est ici définit isolément.
// Littéral d'objet vide
var obj = {};
// Un autre objet, nommé « descriptor »
// Par défaut non enumerable,
// non configurable, non writable.
var descriptor = Object.create(null);
- 5/15 -
JavaScript Tome-V
// Définit directe d'une nouvelle propriété
// « value » pour l'objet « descriptor »
// avec la valeur « valueValue »
descriptor.value = 'valueValue';
// Avec « Object.defineProperty » on définit
// la propriété arbitrairement nommé ici
// « cle » pour l'objet obj.
// La description de la clé ou propriété
// « cle » est contenue dans le descripteur
// « descriptor » qui est aussi un objet.
Object.defineProperty(obj, 'cle', descriptor);
console.dir(obj);
// obj.cle=55;
// TypeError: "cle" is read-only
</script>
Cette façon de définir isolément un descripteur est plus claire et facile à
suivre qu’une définition « inline ».
Même définition du descripteur mais inline et explicite :
// Littéral d'objet vide
var obj = {};
Object.defineProperty(obj, 'cle', {
enumerable: false,
configurable: false,
writable: false,
value: 'valueValue',
- 6/15 -
JavaScript Tome-V
});
console.dir(obj);
// obj.cle=55;
</script>
Avec « set » et « get » : accessor property descriptor.
// Littéral d'objet.
var obj = {v:null};
Object.defineProperty(obj, 'cle', {
enumerable: false,
//
writable: false,
//
value: 'valueValue',
set(newVal) {
console.log("Dans « set »");
this.v = newVal;
},
get() {
console.log("Dans « get »");
return this.v;
}
});
console.dir("obj=",obj);
console.dir("obj.cle=",obj.cle);
- 7/15 -
JavaScript Tome-V
console.dir("obj['cle']=",obj['cle']);
console.log("obj.v = Date.now()=",obj.v = Date.now());
console.log("obj.v=",obj.v);
// obj.cle=55;
</script>
Définition de descripteur via un callBack :
// descrFct est une fonction,
// donc un objet, donc peut avoir
// des propriétés (ayant des descriptors).
//
//
//
//
//
//
Cette fonction retourne l'objet « d » qui
peut donc être (et l'est effectivement ici)
utilisé comme descripteur (puisqu'il est à
la position de descripteur en argument).
// Littéral d'objet vide auquel on va
// ajouter la propriété nommée 'cle'
var obj = {};
const descrFct = function(p) {
- 8/15 -
JavaScript Tome-V
var d =
// d = Variable locale « d » qui prend
// l'adresse du descripteur de descrFct
descrFct.d = { // .d = Descriptor dans descrFct
enumerable: false,
// Attributs de .d
writable: false,
value: "DUMMYneoDescrFct"
};
console.log("*** d=",d); // Affiche d.value
d.value = p;
console.log("*** d=",d); // Affiche nvlle d.value
return d; // Le descriptor de descrFct,
// deviendra le descripteur de « cle »
// qui deviendra ainsi une propriété.
};
// Définition d'une nouvelle propriété via callBack
Object.defineProperty(obj,
'cle', descrFct('valueValue'));
// Fin Définition nouvelle propriété via callBack
console.dir(`descrFct= `,descrFct);
console.dir("obj=",obj);
console.dir("obj.cle=",obj.cle);
obj.cle=55;
// pcq « writable = false »
</script>
- 9/15 -
JavaScript Tome-V
Différence dans la création de propriété avec « assignation » (affectation directe) et par la « méthode defineProperty() » de l'objet
transcendant Object :
Avec la « méthode defineProperty() », les attributs « enumerable »,
« configurable », et « writable » ont la valeur « false ».
Par affectation directe, ces attributs sont « true ».
<script language="javascript"> "use strict";
const o = {};
var descriptor1 = Object.create(null);
descriptor1.value = 'static';
o.key2 = "dynamic"
Object.defineProperty(o, 'key1', descriptor1);
// Valeurs par défaut du descripteur de key1
// créé avec "Object.defineProperty" :
// value=undefined, not enumerable, not configurable, not
writable.
// not writable => on ne peut pas modifier le descripteur
/**/ console.dir(Object.getOwnPropertyDescriptors(o));
// Object
//
key1: {
//
value: "static",
//
writable: false,
//
enumerable: false,
//
configurable: false
//
}
//
//
key2: {
//
value: "dynamic",
- 10/15 -
//
//
//
//
JavaScript Tome-V
writable: true,
enumerable: true,
configurable: true
}
/**/ console.dir(Object.getOwnPropertyNames(o));
// Array(2)
//
0: "key2"
//
1: "key1"
//
length: 2
o.key2 = "*** dynamic ***"
// Valeurs par défaut des propriétés du descripteur de
key2
// créé par affectation directe :
// value=undefined, enumerable, configurable, writable.
// writable => on peut modifier le descripteur
/**/ console.dir(Object.getOwnPropertyDescriptors(o));
// Object
// key1: {
//
value: "static",
//
writable: false,
//
enumerable: false,
//
configurable: false
// }
//
// key2: {
//
value: "*** dynamic ***",
//
writable: true,
//
enumerable: true,
//
configurable: true
// }
/**/// obj.key1 = 'static';
// test.html:135 - Uncaught TypeError:
// Cannot assign to read only property 'key1' of
// object '#<Object>'
// Seulement les propriétés énumerables
// seront listées ci-après.
for (var i in o) {
- 11/15 -
console.log(i);
JavaScript Tome-V
// key2
}
console.log(Object.keys(o));
// ["key2"]
console.log(o.propertyIsEnumerable('key1')); // false
console.log(o.propertyIsEnumerable('key2')); // true
</script>
« value » apparaît seulement dans les « data descriptors », alors que
« get » apparaît seulement dans les « accessor descriptors »,
les deux ne pouvant pas se retrouver ensemble.
Si le descripteur n’a aucune des clés « value », « writable », « get » ni
« set », il est traité comme « data descriptor ».
Si le descripteur a les deux clés « value » ou « writable » et en même
temps « get » ou « set », alors une exception est générée.
Kinshasa, le 4 avril 2019 (10:46:43 PM).
Mots-clés :
Getter, Setter, get, set, this, inline, callback, accessor property descriptor n accessor, property, descriptor , descripteur, definegetter,
definesetter, defineProperty, getOwnPropertyNames, javascript,
ecmascript
- 12/15 -
JavaScript Tome-V
DIASOLUKA Nz. Luyalu
Docteur en Médecine, Chirurgie & Accouchements (1977),
CNOM : 0866 - Spécialiste en ophtalmologie (1980)
Études humanités : Scientifique - Mathématiques & Physique.
Informaticien-amateur, Programmeur et WebMaster.
Chercheur indépendant, autonome et autofinancé, bénévole, sans
aucun conflit d’intérêt ou liens d'intérêts ou contrainte
promotionnelle avec qui qu’il soit ou quelqu’organisme ou
institution / organisation que ce soit, étatique, paraétatique ou privé,
industriel ou commercial en relation avec le sujet présenté.
+243 - 851278216 - 899508675 - 991239212 - 902263541 - 813572818
[email protected]
Autre Lecture :
https://www.scribd.com/document/374738470/Le-Plus-GrandSecret-de-La-Creation
D’autres publications pouvant aussi intéresser :
• https://www.scribd.com/document/377036251/LeDosage-Des-Medicaments-en-Cac-Cas
• https://www.scribd.com/document/377035454/LeHasard-Des-Thermometres-Non-contact-a-Infrarouge
• https://www.scribd.com/document/376222482/PetiteIntroduction-Aux-Fonctions-JavaScript
• https://www.scribd.com/document/376221919/La-Foien-Jesus-Christ-Pour-Quoi-Faire
• https://www.scribd.com/document/375689778/LacuitedefineProperty, defineProperties
- 13/15 -
JavaScript Tome-V
visuelle-angulaire
• https://www.scribd.com/document/375349851/Lavariable-This
•
https://www.scribd.com/document/375024162/FonctionsImbriquees-en-JS
• https://www.scribd.com/document/374789297/FormatInterne-Des-Objets-JavaScript
•
https://www.scribd.com/document/374788758/Iterationsen-JavaScript
• https://www.scribd.com/document/374738470/Le-PlusGrand-Secret-de-La-Creation
• https://www.scribd.com/document/374597969/NouvelleFormule-d-IMC-indice-de-doduite-Selon-Dr-Diasoluka
• https://www.scribd.com/document/373847209/PropertyDescriptors
• https://www.scribd.com/document/373833282/l-ObjetGlobal-Window
•
https://www.scribd.com/document/372665249/JavascriptTome-II
• https://www.scribd.com/document/355291488/motiliteoculaire-2
• https://www.scribd.com/document/355291239/motiliteoculaire-I
• https://www.scribd.com/document/355290248/Script-dAnalyses-Des-Reflexes-Pupillomoteurs
•
https://www.scribd.com/document/321168468/Renseigne
ments-Id-et-Anthropometriques
•
https://www.scribd.com/document/320856721/Emission31-Jul-2016
•
https://www.scribd.com/document/318182982/Complicati
defineProperty, defineProperties - 14/15 - jeudi, 4. avril 2019
JavaScript Tome-V
on-Visuelle-du-Traitement-de-La-Malaria
• https://www.scribd.com/document/318180637/RapportEntre-Oxymetrie-Et-Type-Respiration
•
https://www.scribd.com/document/315746265/Classificati
on-Des-Medicaments
•
https://www.scribd.com/document/315745909/Incongrue
nces-Heresies-et-Heterodoxies-de-la-Notion-de-Laboratoire
• https://www.scribd.com/document/315745725/RapportEntre-Oxymetrie-Et-Type-Respiration
- 15/15 -

JavaScript - Object.defineProperties

Transcription

Documents pareils

1 Utiliser JavaScript dans HTML

Du regard de l`enseignant sur la prestation des

CCI Paris Ile-de-France Bourse de commerce

terre de bruyere

PROJET PEDAGOGIQUE 5°1 Séquence n°1 : Le texte narratif

Assemblée des Parties de l`OIDD 6 novembre 2014

Tea House - ShowTime

Console - Bidon recyclé et Teck

ActiveX et JavaScript

la console vsmile - MetaGames-EU