diff options
Diffstat (limited to 'files/fr/web/javascript/reference/objets_globaux/array/splice/index.html')
-rw-r--r-- | files/fr/web/javascript/reference/objets_globaux/array/splice/index.html | 146 |
1 files changed, 146 insertions, 0 deletions
diff --git a/files/fr/web/javascript/reference/objets_globaux/array/splice/index.html b/files/fr/web/javascript/reference/objets_globaux/array/splice/index.html new file mode 100644 index 0000000000..660bd81fb3 --- /dev/null +++ b/files/fr/web/javascript/reference/objets_globaux/array/splice/index.html @@ -0,0 +1,146 @@ +--- +title: Array.prototype.splice() +slug: Web/JavaScript/Reference/Objets_globaux/Array/splice +tags: + - Array + - JavaScript + - Méthode + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Array/splice +--- +<div>{{JSRef}}</div> + +<p>La méthode <strong><code>splice()</code></strong> modifie le contenu d'un tableau en retirant des éléments et/ou en ajoutant de nouveaux éléments <a href="https://en.wikipedia.org/wiki/In-place_algorithm">à même le tableau</a>.On peut ainsi vider ou remplacer une partie d'un tableau.</p> + +<div>{{EmbedInteractiveExample("pages/js/array-splice.html")}}</div> + +<p class="hidden">Le code source de cet exemple interactif est disponible dans un dépôt GitHub. Si vous souhaitez contribuez à ces exemples, n'hésitez pas à cloner <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> et à envoyer une <em>pull request</em> !</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox"><var>var tabElementsSupprimes = array</var>.splice(<var>début</var>, nbASupprimer[, <var>élem1</var>[, élem2[, ...]]]) +</pre> + +<h3 id="Paramètres">Paramètres</h3> + +<dl> + <dt><code>début</code></dt> + <dd>L'indice à partir duquel commencer à changer le tableau (l'indice du premier élement étant <code>0</code>).</dd> + <dd>Si sa valeur est supérieure à la longueur du tableau <code><var>array</var>.length</code>, <code>début</code> est ramené à la longueur du tableau <code><var>array</var>.length</code>.</dd> + <dd>S'il est négatif, le changement commencera d'autant d'éléments à partir de la fin du tableau, c'est à dire à partir de l'index <code><var>array</var>.length + <var>début</var></code>. Si <code><var>array</var>.length + <var>début</var></code> est inférieur à <code>0</code>, le changement commencera à l'index <code>0</code>.</dd> +</dl> + +<dl> + <dt><code>nbASupprimer</code></dt> + <dd>Un entier indiquant le nombre d'anciens éléments à remplacer.<br> + Si ce paramètre est absent ou si sa valeur est supérieure ou égale à <code>array.length - début</code>, alors les éléments entre <code>début</code> et la fin du tableau seront supprimés.</dd> + <dd>Si <code>nbASupprimer</code> vaut 0, aucun élément ne sera supprimé. Dans ce cas, il est nécessaire de spécifier au moins un nouvel élément.</dd> +</dl> + +<dl> + <dt><code>élemN</code></dt> + <dd>Les éléments à ajouter au tableau à partir de <code>début</code>. Si vous ne spécifiez pas de nouvel élément, les anciens éléments seront simplement supprimés du tableau.</dd> +</dl> + +<h3 id="Valeur_de_retour">Valeur de retour</h3> + +<p>Un tableau contenant les éléments supprimés. Si un seul élément est supprimé, un tableau contenant un unique élément est retourné.</p> + +<h2 id="Description">Description</h2> + +<p>Si vous spécifiez un nombre différent d'éléments à insérer et d'éléments à supprimer, le tableau aura une longueur différente après l'appel de la méthode.</p> + +<h2 id="Exemples">Exemples</h2> + +<h3 id="Utiliser_splice">Utiliser <code>splice</code></h3> + +<p>Le script suivant illustre l'utilisation de <code>splice</code> :</p> + +<pre class="brush: js">var mesPoissons = ["scalaire", "clown", "mandarin", "chirurgien"]; + +// supprime 0 élément à partir de l'index 2, et insère "tambour" +var enleves = mesPoissons.splice(2, 0, "tambour"); +// mesPoissons est ["scalaire", "clown", "tambour", "mandarin", "chirurgien"] +// enleves est [], aucun élément supprimé + +// supprime 1 élément à partir de l'index 3 +enleves = mesPoissons.splice(3, 1); +// mesPoissons est ["scalaire", "clown", "tambour", "chirurgien"] +// enleves est ["mandarin"] + +// supprime 1 élément à partir de l'index 2, et insère "trompette" +enleves = mesPoissons.splice(2, 1, "trompette"); +// mesPoissons est ["scalaire", "clown", "trompette", "chirurgien"] +// enleves est ["tambour"] + +// supprime 2 éléments à partir de l'index 0, et insère "perroquet", "anémone" et"bleu" +enleves = mesPoissons.splice(0, 2, "perroquet", "anémone", "bleu"); +// mesPoissons est ["perroquet", "anémone", "bleu", "trompette", "chirurgien"] +// enleves est ["scalaire", "clown"] + +// supprime 2 éléments à partir de l'indice 2 +enleves = mesPoissons.splice(mesPoissons.length - 3, 2); +// mesPoissons est ["perroquet", "anémone", "chirurgien"] +// enleves est ["bleu", "trompette"] + +var mesPoissons = ["perroquet", "anémone", "bleu", "trompette", "chirurgien"]; +// on retire trois éléments à partir de l'indice 2 +enleves = mesPoissons.splice(2); +// mesPoissons vaut ["perroquet", "anémone"] +// enleves vaut ["bleu", "trompette", "chirurgien"] + +var mesAnimaux = ["cheval", "chien", "chat", "dauphin"]; +enleves = mesAnimaux.splice(-2, 1); + +// mesAnimaux vaut ["cheval", "chien", "dauphin"] +// enleves vaut ["chat"] +</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('ESDraft', '#sec-array.prototype.splice', 'Array.prototype.splice')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-array.prototype.splice', 'Array.prototype.splice')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.4.4.12', 'Array.prototype.splice')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES3')}}</td> + <td>{{Spec2('ES3')}}</td> + <td>Définition initiale. Implémentée avec JavaScript 1.2.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div> +<div class="hidden">Le tableau de compatibilité de cette page a été généré à partir de données structurées. Si vous souhaitez contribuer à ces données, n'hésitez pas à consulter <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et à nous envoyer une<em>pull request</em>.</div> + +<p>{{Compat("javascript.builtins.Array.splice")}}</p> +</div> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li>{{jsxref("Array.prototype.push", "push")}} / {{jsxref("Array.prototype.pop", "pop")}} pour ajouter/supprimer des éléments en fin de tableau</li> + <li>{{jsxref("Array.prototype.unshift", "unshift")}} / {{jsxref("Array.prototype.shift", "shift")}} pour ajouter/supprimer des éléments en début de tableau</li> + <li>{{jsxref("Array.prototype.concat", "concat")}} qui renvoie un nouveau tableau résultat de la concaténation d'un tableau avec un autre tableau ou d'autres valeurs</li> +</ul> |