aboutsummaryrefslogtreecommitdiff
path: root/files/fr/web/javascript/reference/functions/rest_parameters/index.md
diff options
context:
space:
mode:
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.md163
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)