aboutsummaryrefslogtreecommitdiff
path: root/files/fr/web/javascript/enumerability_and_ownership_of_properties/index.html
diff options
context:
space:
mode:
Diffstat (limited to 'files/fr/web/javascript/enumerability_and_ownership_of_properties/index.html')
-rw-r--r--files/fr/web/javascript/enumerability_and_ownership_of_properties/index.html326
1 files changed, 326 insertions, 0 deletions
diff --git a/files/fr/web/javascript/enumerability_and_ownership_of_properties/index.html b/files/fr/web/javascript/enumerability_and_ownership_of_properties/index.html
new file mode 100644
index 0000000000..a4d1574b35
--- /dev/null
+++ b/files/fr/web/javascript/enumerability_and_ownership_of_properties/index.html
@@ -0,0 +1,326 @@
+---
+title: Rattachement et caractère énumérable des propriétés
+slug: Web/JavaScript/Caractère_énumérable_des_propriétés_et_rattachement
+tags:
+ - Guide
+ - Intermédiaire
+ - JavaScript
+translation_of: Web/JavaScript/Enumerability_and_ownership_of_properties
+---
+<div>{{JsSidebar("More")}}</div>
+
+<p>Les propriétés dites « énumérables » sont celles pour lesquelles la caractéristique interne <code>[[Enumerable]]</code> vaut <code>true</code>. C'est le cas par défaut pour les propriétés qui sont créées grâce à une affectation simple ou grâce à un initialisateur de propriété. Les propriétés définies avec des méthodes analogues à {{jsxref("Object.defineProperty()")}} auront <code>[[Enumerable]]</code> à <code>false</code>). Les propriétés énumérables sont celles qui seront parcourues dans une boucle {{jsxref("Instructions/for...in","for..in")}} (sauf si le nom de la propriété est un {{jsxref("Symbol")}}).</p>
+
+<p>Le rattachement des propriétés est détérminé selon que la propriété est directement rattachée à l'objet et non à sa chaîne de prototypes. Il est également possible de récupérer l'ensemble des propriétés d'un objet. Dans le tableau suivant, on détaille les moyens possibles pour détecter, parcourir, énumérer, récupérer les propriétés d'un objet.</p>
+
+<div style="overflow: auto; width: 100%;">
+<table>
+ <caption>Caractère énumérable et rattachement - méthodes natives pour détecter, récupérer et parcourir les propriétés</caption>
+ <tbody>
+ <tr>
+ <th>Fonctionnalité</th>
+ <th>Rattachement direct à l'objet</th>
+ <th>Rattachement direct à l'objet et sur la chaîne de prototypes</th>
+ <th>Uniquement sur la chaîne de prototypes</th>
+ </tr>
+ <tr>
+ <td>Détection</td>
+ <td>
+ <table>
+ <thead>
+ <tr>
+ <th scope="col">Énumérables</th>
+ <th scope="col">Non-énumérables</th>
+ <th scope="col">Toutes</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>
+ <p><code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/Object/propertyIsEnumerable">propertyIsEnumerable()</a></code></p>
+
+ <p><code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/Object/hasOwnProperty">hasOwnProperty()</a></code></p>
+ </td>
+ <td><code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/Object/hasOwnProperty">hasOwnProperty()</a> - </code>en utilisant <code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/Object/propertyIsEnumerable">propertyIsEnumerable()</a></code> afin d'exclure les propriétés énumérables</td>
+ <td><code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/Object/hasOwnProperty">hasOwnProperty()</a></code></td>
+ </tr>
+ </tbody>
+ </table>
+ </td>
+ <td>
+ <table>
+ <thead>
+ <tr>
+ <th scope="col">Énumerables</th>
+ <th scope="col">Non-énumérables</th>
+ <th scope="col">Toutes</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>Cette fonctionnalité n'est pas disponible sans code supplémentaire.</td>
+ <td>Cette fonctionnalité n'est pas disponible sans code supplémentaire.</td>
+ <td><code><a href="/fr/docs/Web/JavaScript/Reference/Opérateurs/L_opérateur_in">in</a></code></td>
+ </tr>
+ </tbody>
+ </table>
+ </td>
+ <td>Cette fonctionnalité n'est pas disponible sans code supplémentaire.</td>
+ </tr>
+ <tr>
+ <td>Récupération</td>
+ <td>
+ <table>
+ <thead>
+ <tr>
+ <th scope="col">Énumérables</th>
+ <th scope="col">Non-énumérables</th>
+ <th scope="col">Toutes</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>
+ <p><code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/Object/keys">Object.keys()</a></code></p>
+
+ <p><code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/Object/getOwnPropertyNames">getOwnPropertyNames()</a></code></p>
+
+ <p><code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/Object/getOwnPropertySymbols">getOwnPropertySymbols()</a></code></p>
+ </td>
+ <td><code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/Object/getOwnPropertyNames">getOwnPropertyNames()</a></code> <code>- <a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/Object/getOwnPropertySymbols">getOwnPropertySymbols()</a> </code>en utilisant <code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/Object/propertyIsEnumerable">propertyIsEnumerable()</a></code> afin d'exclure les propriétés énumérables</td>
+ <td>
+ <p><code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/Object/getOwnPropertyNames">getOwnPropertyNames()</a></code></p>
+
+ <p><code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/Object/getOwnPropertySymbols">getOwnPropertySymbols()</a></code></p>
+ </td>
+ </tr>
+ </tbody>
+ </table>
+ </td>
+ <td>Cette fonctionnalité n'est pas disponible sans code supplémentaire.</td>
+ <td>Cette fonctionnalité n'est pas disponible sans code supplémentaire.</td>
+ </tr>
+ <tr>
+ <td>Parcours</td>
+ <td>
+ <table>
+ <thead>
+ <tr>
+ <th scope="col">Énumérables</th>
+ <th scope="col">Non-énumérables</th>
+ <th scope="col">Toutes</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>
+ <p><code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/Object/keys">Object.keys()</a></code></p>
+
+ <p><code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/Object/getOwnPropertyNames">getOwnPropertyNames()</a></code></p>
+
+ <p><code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/Object/getOwnPropertySymbols">getOwnPropertySymbols()</a></code></p>
+ </td>
+ <td><code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/Object/getOwnPropertyNames">getOwnPropertyNames()</a> - <a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/Object/getOwnPropertySymbols">getOwnPropertySymbols()</a></code>en utilisant <code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/Object/propertyIsEnumerable">propertyIsEnumerable()</a></code> afin d'exclure les propriétés énumérables</td>
+ <td>
+ <p><code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/Object/getOwnPropertyNames">getOwnPropertyNames()</a></code></p>
+
+ <p><code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/Object/getOwnPropertySymbols">getOwnPropertySymbols()</a></code></p>
+ </td>
+ </tr>
+ </tbody>
+ </table>
+ </td>
+ <td>
+ <table>
+ <thead>
+ <tr>
+ <th scope="col">Énumerables</th>
+ <th scope="col">Non-énumérables</th>
+ <th scope="col">Toutes</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td><code><a href="/fr/docs/Web/JavaScript/Reference/Instructions/for...in">for..in</a></code></td>
+ <td>Cette fonctionnalité n'est pas disponible sans code supplémentaire.</td>
+ <td>Cette fonctionnalité n'est pas disponible sans code supplémentaire.</td>
+ </tr>
+ </tbody>
+ </table>
+ </td>
+ <td>Cette fonctionnalité n'est pas disponible sans code supplémentaire.</td>
+ </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Obtenir_les_propriétés_selon_leur_caractère_énumérable_et_selon_leur_rattachement">Obtenir les propriétés selon leur caractère énumérable et selon leur rattachement</h2>
+
+<p>Dans la plupart des cas, ce n'est pas l'algorithme le plus efficace mais il est présenté ici à des fins explicatives.</p>
+
+<ul>
+ <li>On peut détecter la présence d'une propriété grâce à <code>RecuperateurDePropriete.laMethodeSouhaitee(obj).indexOf(prop) &gt; -1</code></li>
+ <li>On peut parcourir les propriétés souhaitées avec <code>RecuperateurDePropriete.laMethodeSouhaitee(obj).forEach(function (value, prop) {});</code> (on peut aussi utiliser <code>filter()</code>, <code>map()</code>, etc.)</li>
+</ul>
+
+<pre class="brush: js">var RecuperateurDePropriete = {
+ getOwnEnumerables: function (obj) {
+ return this._getPropertyNames(obj, true, false, this._enumerable);
+ // On pourrait également utiliser for..in qu'on filtre avec hasOwnProperty
+ // ou encore : return Object.keys(obj);
+ },
+ getOwnNonenumerables: function (obj) {
+ return this._getPropertyNames(obj, true, false, this._notEnumerable);
+ },
+ getOwnEnumerablesAndNonenumerables: function (obj) {
+ return this._getPropertyNames(obj, true, false, this._enumerableAndNotEnumerable);
+ // On peut également simplement utiliser : return Object.getOwnPropertyNames(obj);
+ },
+ getPrototypeEnumerables: function (obj) {
+ return this._getPropertyNames(obj, false, true, this._enumerable);
+ },
+ getPrototypeNonenumerables: function (obj) {
+ return this._getPropertyNames(obj, false, true, this._notEnumerable);
+ },
+ getPrototypeEnumerablesAndNonenumerables: function (obj) {
+ return this._getPropertyNames(obj, false, true, this._enumerableAndNotEnumerable);
+ },
+ getOwnAndPrototypeEnumerables: function (obj) {
+ return this._getPropertyNames(obj, true, true, this._enumerable);
+ // On pourra aussi utiliser for..in sans filtre
+ },
+ getOwnAndPrototypeNonenumerables: function (obj) {
+ return this._getPropertyNames(obj, true, true, this._notEnumerable);
+ },
+ getOwnAndPrototypeEnumerablesAndNonenumerables: function (obj) {
+ return this._getPropertyNames(obj, true, true, this._enumerableAndNotEnumerable);
+ },
+ // Fonctions de rappels statiques
+ _enumerable : function (obj, prop) {
+ return obj.propertyIsEnumerable(prop);
+ },
+ _notEnumerable : function (obj, prop) {
+ return !obj.propertyIsEnumerable(prop);
+ },
+ _enumerableAndNotEnumerable : function (obj, prop) {
+ return true;
+ },
+ // Inspirée par https://stackoverflow.com/a/8024294/271577
+ _getPropertyNames : function getAllPropertyNames(obj, iterateSelfBool, iteratePrototypeBool, includePropCb) {
+ var props = [];
+
+ do {
+ if (iterateSelfBool) {
+ Object.getOwnPropertyNames(obj).forEach(function (prop) {
+ if (props.indexOf(prop) === -1 &amp;&amp; includePropCb(obj, prop)) {
+ props.push(prop);
+ }
+ });
+ }
+ if (!iteratePrototypeBool) {
+ break;
+ }
+ iterateSelfBool = true;
+ } while (obj = Object.getPrototypeOf(obj));
+
+ return props;
+ }
+};</pre>
+
+<h2 id="Tableau_de_détection">Tableau de détection</h2>
+
+<table>
+ <thead>
+ <tr>
+ <th scope="row"></th>
+ <th scope="col"><code>in</code></th>
+ <th scope="col"><code>for..in</code></th>
+ <th scope="col"><code>obj.hasOwnProperty()</code></th>
+ <th scope="col"><code>obj.propertyIsEnumerable()</code></th>
+ <th scope="col"><code>Object.keys()</code></th>
+ <th scope="col"><code>Object.getOwnPropertyNames()</code></th>
+ <th scope="col"><code>Object.getOwnPropertyDescriptors()</code></th>
+ <th scope="col"><code>Reflect.ownKeys()</code></th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <th scope="row">Propriétés énumérables</th>
+ <td>true</td>
+ <td>true</td>
+ <td>true</td>
+ <td>true</td>
+ <td>true</td>
+ <td>true</td>
+ <td>true</td>
+ <td>true</td>
+ </tr>
+ <tr>
+ <th scope="row">Propriétés non-énumérables</th>
+ <td>true</td>
+ <td>false</td>
+ <td>true</td>
+ <td>false</td>
+ <td>false</td>
+ <td>true</td>
+ <td>true</td>
+ <td>true</td>
+ </tr>
+ <tr>
+ <th scope="row">Propriétés dont les clés sont des symboles</th>
+ <td>true</td>
+ <td>false</td>
+ <td>true</td>
+ <td>false</td>
+ <td>false</td>
+ <td>false</td>
+ <td>true</td>
+ <td>true</td>
+ </tr>
+ <tr>
+ <th scope="row">Propriétés héritées et énumérables</th>
+ <td>true</td>
+ <td>true</td>
+ <td>false</td>
+ <td>false</td>
+ <td>false</td>
+ <td>false</td>
+ <td>false</td>
+ <td>false</td>
+ </tr>
+ <tr>
+ <th scope="row">Propriétés héritées et non-énumérables</th>
+ <td>true</td>
+ <td>false</td>
+ <td>false</td>
+ <td>false</td>
+ <td>false</td>
+ <td>false</td>
+ <td>false</td>
+ <td>false</td>
+ </tr>
+ <tr>
+ <th scope="row">Propriétés héritées dont les clés sont des symboles</th>
+ <td>true</td>
+ <td>false</td>
+ <td>false</td>
+ <td>false</td>
+ <td>false</td>
+ <td>false</td>
+ <td>false</td>
+ <td>false</td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="Voir_aussi">Voir aussi</h2>
+
+<ul>
+ <li><code><a href="/fr/docs/Web/JavaScript/Reference/Opérateurs/L_opérateur_in">in</a></code></li>
+ <li><code><a href="/fr/docs/Web/JavaScript/Reference/Instructions/for...in">for..in</a></code></li>
+ <li>{{jsxref("Object.hasOwnProperty()")}}</li>
+ <li>{{jsxref("Object.propertyIsEnumerable()")}}</li>
+ <li>{{jsxref("Object.getOwnPropertyNames()")}}</li>
+ <li>{{jsxref("Object.keys()")}}</li>
+ <li>{{jsxref("Object.getOwnPropertyDescriptors()")}}</li>
+</ul>
generated by cgit v1.2.3-54-g00ecf (git 2.39.0) at 2025-01-28 07:07:23 +0000