aboutsummaryrefslogtreecommitdiff
path: root/files/fr/web/javascript/reference/functions/method_definitions
diff options
context:
space:
mode:
authorjulieng <julien.gattelier@gmail.com>2021-08-03 08:03:23 +0200
committerSphinxKnight <SphinxKnight@users.noreply.github.com>2021-09-03 08:08:25 +0200
commitbf8e099b9c8b3c60d60b3712b4fc97b052c39887 (patch)
treec101746d082c9581c94f5937519c7d0e2f4af8cb /files/fr/web/javascript/reference/functions/method_definitions
parent844f5103992238c0c23203286dad16a466e89c97 (diff)
downloadtranslated-content-bf8e099b9c8b3c60d60b3712b4fc97b052c39887.tar.gz
translated-content-bf8e099b9c8b3c60d60b3712b4fc97b052c39887.tar.bz2
translated-content-bf8e099b9c8b3c60d60b3712b4fc97b052c39887.zip
convert content to md
Diffstat (limited to 'files/fr/web/javascript/reference/functions/method_definitions')
-rw-r--r--files/fr/web/javascript/reference/functions/method_definitions/index.md177
1 files changed, 83 insertions, 94 deletions
diff --git a/files/fr/web/javascript/reference/functions/method_definitions/index.md b/files/fr/web/javascript/reference/functions/method_definitions/index.md
index 13c6fdf0fa..a0e36dc8e0 100644
--- a/files/fr/web/javascript/reference/functions/method_definitions/index.md
+++ b/files/fr/web/javascript/reference/functions/method_definitions/index.md
@@ -11,68 +11,70 @@ tags:
translation_of: Web/JavaScript/Reference/Functions/Method_definitions
original_slug: Web/JavaScript/Reference/Fonctions/Définition_de_méthode
---
-<div>{{JsSidebar("Functions")}}</div>
+{{JsSidebar("Functions")}}
-<p>Avec ECMAScript 2015 (ES6), il est possible d'utiliser une notation plus courte pour définir des méthodes au sein des littéraux objets. On peut ainsi définir plus rapidement une fonction qui sera utilisée comme méthode.</p>
+Avec ECMAScript 2015 (ES6), il est possible d'utiliser une notation plus courte pour définir des méthodes au sein des littéraux objets. On peut ainsi définir plus rapidement une fonction qui sera utilisée comme méthode.
-<div>{{EmbedInteractiveExample("pages/js/functions-definitions.html")}}</div>
+{{EmbedInteractiveExample("pages/js/functions-definitions.html")}}
-<h2 id="Syntaxe">Syntaxe</h2>
+## Syntaxe
-<pre class="syntaxbox">var obj = {
- <var>property</var>( <var>parameters…</var> ) {},
- *<var>generator</var>( <var>parameters…</var> ) {},
- async property( <var>parameters…</var> ) {},
- async* generator( <var>parameters…</var> ) {},
+ var obj = {
+ property( parameters… ) {},
+ *generator( parameters… ) {},
+ async property( parameters… ) {},
+ async* generator( parameters… ) {},
- // avec les noms calculés :
- [property]( <var>parameters…</var> ) {},
- *[generator]( <var>parameters…</var> ) {},
- async [property]( <var>parameters…</var> ) {},
+ // avec les noms calculés :
+ [property]( parameters… ) {},
+ *[generator]( parameters… ) {},
+ async [property]( parameters… ) {},
- // avec la syntaxe pour les accesseurs
- // mutateurs :
- get <var>property</var>() {},
- set <var>property</var>(<var>value</var>) {}
-};
-</pre>
+ // avec la syntaxe pour les accesseurs
+ // mutateurs :
+ get property() {},
+ set property(value) {}
+ };
-<h2 id="Description">Description</h2>
+## Description
-<p>La notation raccourcie est semblable à la syntaxe introduite par ECMAScript 5 pour les <a href="/fr/docs/Web/JavaScript/Reference/Fonctions/get">accesseurs</a> et <a href="/fr/docs/Web/JavaScript/Reference/Fonctions/set">mutateurs</a>.</p>
+La notation raccourcie est semblable à la syntaxe introduite par ECMAScript 5 pour les [accesseurs](/fr/docs/Web/JavaScript/Reference/Fonctions/get) et [mutateurs](/fr/docs/Web/JavaScript/Reference/Fonctions/set).
-<p>Le code suivant :</p>
+Le code suivant :
-<pre class="brush: js">var obj = {
+```js
+var obj = {
toto: function() {
/* du code */
},
truc: function() {
/* du code */
}
-};</pre>
+};
+```
-<p>Peut désormais être raccourci en :</p>
+Peut désormais être raccourci en :
-<pre class="brush: js">var obj = {
+```js
+var obj = {
toto() {
/* du code */
},
  truc() {
/* du code */
}
-};</pre>
+};
+```
-<h3 id="Notation_raccourcie_pour_les_générateurs">Notation raccourcie pour les générateurs</h3>
+### Notation raccourcie pour les générateurs
-<p><a href="/fr/docs/Web/JavaScript/Reference/Instructions/function*">Les générateurs</a> sont des méthodes et peuvent donc être définis en utilisant la notation raccourci. Lorsqu'on les utilise :</p>
+[Les générateurs](/fr/docs/Web/JavaScript/Reference/Instructions/function*) sont des méthodes et peuvent donc être définis en utilisant la notation raccourci. Lorsqu'on les utilise :
-<ul>
- <li>L'astérisque de la notation raccourcie doit être située avant le nom de la propriété pour le générateur. Autrement dit, <code>* g(){}</code> fonctionnera mais <code>g*(){}</code> ne fonctionnera pas.</li>
- <li>Les définitions des méthodes qui ne sont pas des générateurs ne peuvent pas contenir le mot-clé <code>yield</code>. Cela signifie que <a href="/fr/docs/Web/JavaScript/Reference/Instructions/Fonction_génératrice_historique">l'ancienne syntaxe pour les générateurs</a> ne fonctionnera pas et déclenchera une exception {{jsxref("SyntaxError")}}. Il faut toujours utiliser <code>yield</code> avec l'astérisque (<code>*</code>).</li>
-</ul>
+- L'astérisque de la notation raccourcie doit être située avant le nom de la propriété pour le générateur. Autrement dit, `* g(){}` fonctionnera mais `g*(){}` ne fonctionnera pas.
+- Les définitions des méthodes qui ne sont pas des générateurs ne peuvent pas contenir le mot-clé `yield`. Cela signifie que [l'ancienne syntaxe pour les générateurs](/fr/docs/Web/JavaScript/Reference/Instructions/Fonction_génératrice_historique) ne fonctionnera pas et déclenchera une exception {{jsxref("SyntaxError")}}. Il faut toujours utiliser `yield` avec l'astérisque (`*`).
-<pre class="brush: js">// Notation utilisant une propriété nommée (avant-ES2015)
+```js
+// Notation utilisant une propriété nommée (avant-ES2015)
var obj2 = {
g: function*() {
var index = 0;
@@ -92,13 +94,15 @@ var obj2 = {
var it = obj2.g();
console.log(it.next().value); // 0
-console.log(it.next().value); // 1</pre>
+console.log(it.next().value); // 1
+```
-<h3 id="Méthodes_asynchrones_avec_notation_raccourcie">Méthodes asynchrones avec notation raccourcie</h3>
+### Méthodes asynchrones avec notation raccourcie
-<p><a href="/fr/docs/Web/JavaScript/Reference/Instructions/async_function">Les méthodes asynchrones</a> peuvent également être définies grâce à une syntaxe raccourcie.</p>
+[Les méthodes asynchrones](/fr/docs/Web/JavaScript/Reference/Instructions/async_function) peuvent également être définies grâce à une syntaxe raccourcie.
-<pre class="brush: js">// On utilise une propriété nommée
+```js
+// On utilise une propriété nommée
var obj3 = {
f: async function () {
await une_promesse;
@@ -112,13 +116,14 @@ var obj3 = {
await une_promesse;
}
};
-</pre>
+```
-<h3 id="Méthodes_génératrices_asynchrones">Méthodes génératrices asynchrones</h3>
+### Méthodes génératrices asynchrones
-<p>Les méthodes génératrices peuvent également être asynchrones (cf. <code><a href="/fr/docs/Web/JavaScript/Reference/Instructions/async_function">async</a></code>) :</p>
+Les méthodes génératrices peuvent également être asynchrones (cf. [`async`](/fr/docs/Web/JavaScript/Reference/Instructions/async_function)) :
-<pre class="brush: js">var obj4 = {
+```js
+var obj4 = {
f: async function* () {
yield 1;
yield 2;
@@ -134,13 +139,15 @@ var obj4 = {
yield 2;
yield 3;
}
-};</pre>
+};
+```
-<h3 id="Les_définitions_de_méthodes_ne_sont_pas_constructibles">Les définitions de méthodes ne sont pas constructibles</h3>
+### Les définitions de méthodes ne sont pas constructibles
-<p>Les définitions de méthodes ne sont pas des constructeurs et si on tente de les instancier, cela provoquera une exception {{jsxref("TypeError")}}.</p>
+Les définitions de méthodes ne sont pas des constructeurs et si on tente de les instancier, cela provoquera une exception {{jsxref("TypeError")}}.
-<pre class="brush: js">var obj = {
+```js
+var obj = {
méthode() {},
};
new obj.méthode; // TypeError: obj.méthode is not a constructor
@@ -149,24 +156,26 @@ var obj = {
* g() {}
};
new obj.g; // TypeError: obj.g is not a constructuer (changé avec ES2016)
-</pre>
+```
-<h2 id="Exemples">Exemples</h2>
+## Exemples
-<h3 id="Cas_de_test">Cas de test</h3>
+### Cas de test
-<pre class="brush: js">var obj = {
+```js
+var obj = {
a : "toto",
b(){ return this.a; }
};
console.log(obj.b()); // "toto"
-</pre>
+```
-<h3 id="Noms_de_propriétés_calculés">Noms de propriétés calculés</h3>
+### Noms de propriétés calculés
-<p>Cette notation raccourcie peut également être utilisée avec des noms de propriétés calculés.</p>
+Cette notation raccourcie peut également être utilisée avec des noms de propriétés calculés.
-<pre class="brush: js">var bar = {
+```js
+var bar = {
toto0 : function (){return 0;},
toto1(){return 1;},
["toto" + 2](){return 2;},
@@ -174,43 +183,23 @@ console.log(obj.b()); // "toto"
console.log(bar.toto0()); // 0
console.log(bar.toto1()); // 1
-console.log(bar.toto2()); // 2</pre>
-
-<h2 id="Spécifications">Spécifications</h2>
-
-<table class="standard-table">
- <tbody>
- <tr>
- <th scope="col">Spécification</th>
- <th scope="col">État</th>
- <th scope="col">Commentaires</th>
- </tr>
- <tr>
- <td>{{SpecName('ES2015', '#sec-method-definitions', 'Method definitions')}}</td>
- <td>{{Spec2('ES2015')}}</td>
- <td>Définition initiale.</td>
- </tr>
- <tr>
- <td>{{SpecName('ES2016', '#sec-method-definitions', 'Method definitions')}}</td>
- <td>{{Spec2('ES2016')}}</td>
- <td>Les méthodes génératrices ne doivent pas implémenter la trappe [[Construct]] et déclencher une exception lorsqu'elles sont utilisées avec <code>new</code>.</td>
- </tr>
- <tr>
- <td>{{SpecName('ESDraft', '#sec-method-definitions', 'Method definitions')}}</td>
- <td>{{Spec2('ESDraft')}}</td>
- <td> </td>
- </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>
-
-<p>{{Compat("javascript.functions.method_definitions")}}</p>
-
-<h2 id="Voir_aussi">Voir aussi</h2>
-
-<ul>
- <li><code><a href="/fr/docs/Web/JavaScript/Reference/Opérateurs/L_opérateur_get">get</a></code></li>
- <li><code><a href="/fr/docs/Web/JavaScript/Reference/Opérateurs/L_opérateur_set">set</a></code></li>
- <li><a href="/fr/docs/Web/JavaScript/Reference/Grammaire_lexicale">Grammaire lexicale de JavaScript</a></li>
-</ul>
+console.log(bar.toto2()); // 2
+```
+
+## Spécifications
+
+| Spécification | État | Commentaires |
+| ------------------------------------------------------------------------------------------------ | ---------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------ |
+| {{SpecName('ES2015', '#sec-method-definitions', 'Method definitions')}} | {{Spec2('ES2015')}} | Définition initiale. |
+| {{SpecName('ES2016', '#sec-method-definitions', 'Method definitions')}} | {{Spec2('ES2016')}} | Les méthodes génératrices ne doivent pas implémenter la trappe [[Construct]] et déclencher une exception lorsqu'elles sont utilisées avec `new`. |
+| {{SpecName('ESDraft', '#sec-method-definitions', 'Method definitions')}} | {{Spec2('ESDraft')}} |   |
+
+## Compatibilité des navigateurs
+
+{{Compat("javascript.functions.method_definitions")}}
+
+## Voir aussi
+
+- [`get`](/fr/docs/Web/JavaScript/Reference/Opérateurs/L_opérateur_get)
+- [`set`](/fr/docs/Web/JavaScript/Reference/Opérateurs/L_opérateur_set)
+- [Grammaire lexicale de JavaScript](/fr/docs/Web/JavaScript/Reference/Grammaire_lexicale)