diff options
author | julieng <julien.gattelier@gmail.com> | 2021-08-03 08:03:23 +0200 |
---|---|---|
committer | SphinxKnight <SphinxKnight@users.noreply.github.com> | 2021-09-03 08:08:25 +0200 |
commit | bf8e099b9c8b3c60d60b3712b4fc97b052c39887 (patch) | |
tree | c101746d082c9581c94f5937519c7d0e2f4af8cb /files/fr/web/javascript/reference/functions/rest_parameters/index.md | |
parent | 844f5103992238c0c23203286dad16a466e89c97 (diff) | |
download | translated-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/rest_parameters/index.md')
-rw-r--r-- | files/fr/web/javascript/reference/functions/rest_parameters/index.md | 163 |
1 files changed, 79 insertions, 84 deletions
diff --git a/files/fr/web/javascript/reference/functions/rest_parameters/index.md b/files/fr/web/javascript/reference/functions/rest_parameters/index.md index 90984a9267..6597da94f3 100644 --- a/files/fr/web/javascript/reference/functions/rest_parameters/index.md +++ b/files/fr/web/javascript/reference/functions/rest_parameters/index.md @@ -9,24 +9,26 @@ tags: translation_of: Web/JavaScript/Reference/Functions/rest_parameters original_slug: Web/JavaScript/Reference/Fonctions/paramètres_du_reste --- -<div>{{jsSidebar("Functions")}}</div> +{{jsSidebar("Functions")}} -<p>Cette syntaxe permet de représenter un nombre indéfini d'arguments sous forme d'un tableau.</p> +Cette syntaxe permet de représenter un nombre indéfini d'arguments sous forme d'un tableau. -<div>{{EmbedInteractiveExample("pages/js/functions-restparameters.html")}}</div> +{{EmbedInteractiveExample("pages/js/functions-restparameters.html")}} -<h2 id="Syntaxe">Syntaxe</h2> +## Syntaxe -<pre class="brush: js">function f(a, b, ...lesArguments) { +```js +function f(a, b, ...lesArguments) { // ... } -</pre> +``` -<h2 id="Description">Description</h2> +## Description -<p>Si le dernier paramètre nommé fourni à la fonction est préfixé de <code>...</code> (trois points), il devient un tableau dont les éléments entre <code>0</code> (inclus) et <code>lesArguments.length</code> (exclus) sont fournis comme autres arguments à la fonction.</p> +Si le dernier paramètre nommé fourni à la fonction est préfixé de `...` (trois points), il devient un tableau dont les éléments entre `0` (inclus) et `lesArguments.length` (exclus) sont fournis comme autres arguments à la fonction. -<pre class="brush: js">function maFonction(a, b, ...plusDArguments) { +```js +function maFonction(a, b, ...plusDArguments) { console.log("a", a); console.log("b", b); console.log("plusDArguments", plusDArguments); @@ -36,23 +38,23 @@ maFonction("un", "deux", "trois", "quatre", "cinq"); // affichera ceci dans la console : // a, "un" // b, "deux" -// plusDArguments, ["trois", "quatre", "cinq"]</pre> +// plusDArguments, ["trois", "quatre", "cinq"] +``` -<h3 id="Les_différences_entre_les_paramètres_du_reste_et_l'objet_arguments">Les différences entre les paramètres du reste et l'objet <code>arguments</code></h3> +### Les différences entre les paramètres du reste et l'objet `arguments` -<p>Il y a trois principales différences entre les paramètres du reste et l'objet {{jsxref("Fonctions/arguments","arguments")}} :</p> +Il y a trois principales différences entre les paramètres du reste et l'objet {{jsxref("Fonctions/arguments","arguments")}} : -<ul> - <li>les paramètres du reste sont uniquement ceux qui ne possèdent pas de noms à part entière (autrement dit ceux qui ne sont pas formellement définis dans l'expression de fonction), l'objet <code>arguments</code> contient chaque argument passé à la fonction</li> - <li>l'objet <code>arguments</code> n'est pas, à strictement parler, un tableau. Le paramètre représentant les arguments restant est une instance d'{{jsxref("Array","Array")}} à laquelle on peut appliquer directement des méthodes comme {{jsxref("Array/sort","sort")}}, {{jsxref("Array/map","map")}}, {{jsxref("Array/forEach","forEach")}} ou {{jsxref("Array/pop","pop")}}</li> - <li>l'objet <code>arguments</code> possède des fonctionnalités spécifiques (comme, par exemple, la propriété <code>callee</code>)</li> -</ul> +- les paramètres du reste sont uniquement ceux qui ne possèdent pas de noms à part entière (autrement dit ceux qui ne sont pas formellement définis dans l'expression de fonction), l'objet `arguments` contient chaque argument passé à la fonction +- l'objet `arguments` n'est pas, à strictement parler, un tableau. Le paramètre représentant les arguments restant est une instance d'{{jsxref("Array","Array")}} à laquelle on peut appliquer directement des méthodes comme {{jsxref("Array/sort","sort")}}, {{jsxref("Array/map","map")}}, {{jsxref("Array/forEach","forEach")}} ou {{jsxref("Array/pop","pop")}} +- l'objet `arguments` possède des fonctionnalités spécifiques (comme, par exemple, la propriété `callee`) -<h3 id="Convertir_arguments_en_un_tableau">Convertir <code>arguments</code> en un tableau</h3> +### Convertir `arguments` en un tableau -<p>Ces paramètres ont été introduits afin de réduire le code passe-partout souvent induit par les arguments.</p> +Ces paramètres ont été introduits afin de réduire le code passe-partout souvent induit par les arguments. -<pre class="brush: js">// Avant les paramètres du reste, on observait souvent ce style de code : +```js +// Avant les paramètres du reste, on observait souvent ce style de code : function f(a, b){ var args = Array.prototype.slice.call(arguments, f.length); // ou encore @@ -71,36 +73,40 @@ function f(...args) { var tabNormal = args; var premier = tabNormal.shift(); } -</pre> +``` -<h3 id="La_décomposition_sur_les_paramètres_du_reste">La décomposition sur les paramètres du reste</h3> +### La décomposition sur les paramètres du reste -<p>On peut également décomposer les paramètres du reste en variables distinctes :</p> +On peut également décomposer les paramètres du reste en variables distinctes : -<pre class="brush: js">function f(...[a, b, c]) { +```js +function f(...[a, b, c]) { return a + b + c; } f(1); // NaN (b et c valent undefined) f(1, 2, 3); // 6 f(1, 2, 3, 4); // 6, le dernier paramètre n'est pas décomposé -</pre> +``` -<p>Vous pouvez également accéder aux éléments des paramètres du reste :</p> +Vous pouvez également accéder aux éléments des paramètres du reste : -<pre class="brush: js">function fun1(...lesArguments) { +```js +function fun1(...lesArguments) { console.log("valeur", lesArguments[0][0]); } fun1([5, 2], [5, 4]); // 5 fun1([8, 2]); // 8 -fun1([9, 6, 7]); // 9</pre> +fun1([9, 6, 7]); // 9 +``` -<h2 id="Exemples">Exemples</h2> +## Exemples -<p>S'il n'y a qu'un seul argument qui est décomposé par la syntaxe, la valeur sera toujours un tableau :</p> +S'il n'y a qu'un seul argument qui est décomposé par la syntaxe, la valeur sera toujours un tableau : -<pre class="brush: js">function maFonction(a, b, ...autres); +```js +function maFonction(a, b, ...autres); console.log(a); console.log(b); console.log(autres); @@ -111,11 +117,12 @@ maFonction("un", "deux", "trois"); // "un" // "deux" // ["trois"] -</pre> +``` -<p>De même, s'il n'y a pas suffisamment d'arguments, ce sera un tableau vide :</p> +De même, s'il n'y a pas suffisamment d'arguments, ce sera un tableau vide : -<pre class="brush: js">function maFonction(a, b, ...autres); +```js +function maFonction(a, b, ...autres); console.log(a); console.log(b); console.log(autres); @@ -125,22 +132,25 @@ maFonction("un", "deux"); // affichera ceci dans la console // "un" // "deux" -// []</pre> +// [] +``` -<p><code>lesArguments</code> est un tableau et dispose donc d'une propriété <code>length</code> permettant de compter ses éléments :</p> +`lesArguments` est un tableau et dispose donc d'une propriété `length` permettant de compter ses éléments : -<pre class="brush: js">function fun1(...lesArguments) { +```js +function fun1(...lesArguments) { console.log(lesArguments.length); } fun1(); // 0 fun1(5); // 1 fun1(5, 6, 7); // 3 -</pre> +``` -<p>Dans l'exemple qui suit, on utilise le paramètre Rest pour collecter les arguments après le premier pour les multiplier par le premier :</p> +Dans l'exemple qui suit, on utilise le paramètre Rest pour collecter les arguments après le premier pour les multiplier par le premier : -<pre class="brush: js">function multiplier(facteur, ...lesArguments) { +```js +function multiplier(facteur, ...lesArguments) { return lesArguments.map(function (element) { return facteur * element; }); @@ -148,11 +158,12 @@ fun1(5, 6, 7); // 3 var arr = multiplier(2, 1, 2, 3); console.log(arr); // [2, 4, 6] -</pre> +``` -<p>L'exemple qui suit illustre comment on peut utiliser des méthodes de <code>Array</code> sur le paramètre Rest mais pas sur l'objet <code>arguments</code> :</p> +L'exemple qui suit illustre comment on peut utiliser des méthodes de `Array` sur le paramètre Rest mais pas sur l'objet `arguments` : -<pre class="brush: js">function trierParamRest(...lesArguments) { +```js +function trierParamRest(...lesArguments) { var argumentsTriés = lesArguments.sort(); return argumentsTriés; } @@ -166,51 +177,35 @@ function trierArguments() { // renvoie une exception TypeError: arguments.sort n'est pas une function console.log(trierArguments(5,3,7,1)); -</pre> +``` -<p>Pour utiliser les méthodes propres aux instances d'<code>Array</code> sur l'objet <code>arguments</code>, il est nécessaire de le convertir.</p> +Pour utiliser les méthodes propres aux instances d'`Array` sur l'objet `arguments`, il est nécessaire de le convertir. -<pre class="brush: js">function trierAguments() { +```js +function trierAguments() { var args = Array.from(arguments); var argumentsTriés = args.sort(); return argumentsTriés; } console.log(trierArguments(5, 3, 7, 1)); // [1, 3, 5, 7] -</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('ES6', '#sec-function-definitions', 'Function Definitions')}}</td> - <td>{{Spec2('ES6')}}</td> - <td>Définition initiale.</td> - </tr> - <tr> - <td>{{SpecName('ESDraft', '#sec-function-definitions', 'Function Definitions')}}</td> - <td>{{Spec2('ESDraft')}}</td> - <td></td> - </tr> - </tbody> -</table> - -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> - -<p>{{Compat("javascript.functions.rest_parameters")}}</p> - -<h2 id="Voir_aussi">Voir aussi</h2> - -<ul> - <li>L'objet {{jsxref("Fonctions/arguments","arguments")}}</li> - <li>{{jsxref("Array","Array")}}</li> - <li>{{jsxref("Fonctions","Les fonctions et leurs portées","",1)}}</li> - <li>{{jsxref("Opérateurs/Syntaxe_décomposition","L'opérateur de décomposition","",1)}}</li> - <li><a class="external" href="https://wiki.ecmascript.org/doku.php?id=harmony:rest_parameters">Proposition originale sur ecmascript.org</a> (en anglais)</li> - <li><a class="external" href="https://javascriptweblog.wordpress.com/2011/01/18/javascripts-arguments-object-and-beyond/">JavaScript arguments object and beyond</a> (article en anglais)</li> -</ul> +``` + +## Spécifications + +| Spécification | État | Commentaires | +| ---------------------------------------------------------------------------------------------------- | ---------------------------- | -------------------- | +| {{SpecName('ES6', '#sec-function-definitions', 'Function Definitions')}} | {{Spec2('ES6')}} | Définition initiale. | +| {{SpecName('ESDraft', '#sec-function-definitions', 'Function Definitions')}} | {{Spec2('ESDraft')}} | | + +## Compatibilité des navigateurs + +{{Compat("javascript.functions.rest_parameters")}} + +## Voir aussi + +- L'objet {{jsxref("Fonctions/arguments","arguments")}} +- {{jsxref("Array","Array")}} +- {{jsxref("Fonctions","Les fonctions et leurs portées","",1)}} +- {{jsxref("Opérateurs/Syntaxe_décomposition","L'opérateur de décomposition","",1)}} +- [Proposition originale sur ecmascript.org](https://wiki.ecmascript.org/doku.php?id=harmony:rest_parameters) (en anglais) +- [JavaScript arguments object and beyond](https://javascriptweblog.wordpress.com/2011/01/18/javascripts-arguments-object-and-beyond/) (article en anglais) |