La méthodeslice() des instancesArray retourne uncopie superficielle d'une portion d'un tableau sous la forme d'un nouvel objet tableau sélectionné destart àend (end non incluse), oùstart etend représentent l'indice des éléments dans ce tableau. Le tableau d'origine ne sera pas modifié.

Exemple interactif

const animals = ["ant", "bison", "camel", "duck", "elephant"];console.log(animals.slice(2));// Résultat attendu : Array ["camel", "duck", "elephant"]console.log(animals.slice(2, 4));// Résultat attendu : Array ["camel", "duck"]console.log(animals.slice(1, 5));// Résultat attendu : Array ["bison", "camel", "duck", "elephant"]console.log(animals.slice(-2));// Résultat attendu : Array ["duck", "elephant"]console.log(animals.slice(2, -1));// Résultat attendu : Array ["camel", "duck"]console.log(animals.slice());// Résultat attendu : Array ["ant", "bison", "camel", "duck", "elephant"]

Syntaxe

slice()slice(start)slice(start, end)

Paramètres

startFacultatif

L'indice (compté à partir de zéro) à partir duquel commencer l'extraction,converti en entier.

• Un indice négatif compte depuis la fin du tableau — si-array.length <= start < 0, on utilisestart + array.length.
• Sistart < -array.length ou sistart est omis,0 est utilisé.
• Sistart >= array.length, un tableau vide est retourné.

endFacultatif

L'indice (compté à partir de zéro) jusqu'auquel extraire le fragment,converti en entier.slice() extrait jusqu'à, mais sans inclure,end.

• Un indice négatif compte depuis la fin du tableau — si-array.length <= end < 0, on utiliseend + array.length.
• Siend < -array.length,0 est utilisé.
• Siend >= array.length ou siend est omis ou vautundefined,array.length est utilisé, ce qui entraîne l'extraction de tous les éléments jusqu'à la fin.
• Siend implique une position antérieure ou égale à celle questart implique, un tableau vide est retourné.

Valeur de retour

Un nouveau tableau contenant les éléments extraits.

Description

La méthodeslice() est uneméthode de copie. Elle n'altère pasthis mais retourne plutôt unecopie superficielle contenant certains des mêmes éléments que le tableau d'origine.

La méthodeslice() préserve les emplacements vides. Si la portion découpée constitue un tableau creux (tableau creux), le tableau retourné est également creux.

La méthodeslice() estgénérique. Elle suppose uniquement que la valeur dethis possède une propriétélength et des propriétés dont les clés sont des entiers.

Exemples

Retourner un fragment d'un tableau existant

var fruits = ["Banane", "Orange", "Citron", "Pomme", "Mangue"];var agrumes = fruits.slice(1, 3);// fruits vaut --> ["Banane", "Orange", "Citron", "Pomme", "Mangue"]// agrumes vaut --> ["Orange", "Citron"]

Dans cet exemple,slice(1, 3) extrait les éléments à partir de l'indice1 jusqu'à, mais sans inclure, l'indice3, ce qui donne un nouveau tableau['Orange', 'Citron'].

Omettre le paramètreend

const fruits = ["Pomme", "Banane", "Orange", "Mangue", "Ananas"];const tropical = fruits.slice(2);console.log(tropical); // ['Orange', 'Mangue', 'Ananas']

Dans cet exemple,slice(2) extrait les éléments à partir de l'indice2 jusqu'à la fin du tableau.

Utiliser des indices négatifs

const fruits = ["Pomme", "Banane", "Orange", "Mangue", "Ananas"];const lastTwo = fruits.slice(-2);console.log(lastTwo); // ['Mangue', 'Ananas']

Dans cet exemple,slice(-2) extrait les deux derniers éléments du tableau. Lorsqu'on utilise un indice négatif avec la méthodeslice, les indices négatifs sont comptés depuis la fin du tableau :-1 désigne le dernier élément,-2 le précédent, etc. L'indice négatif-2 est inclus car il représente le point de départ de l'extraction.

|     |     |     |     |     ||  S  |  L  |  I  |  C  |  E  ||     |     |     |     |     |  -5    -4    -3    -2    -1<--- lecture depuis la fin

Utiliser un indice de départ positif et un indice de fin négatif

const fruits = ["Pomme", "Banane", "Orange", "Mangue", "Ananas"];// Utiliser un indice de départ positif et un indice de fin négatifconst sliceExample = fruits.slice(1, -1);console.log(sliceExample); // ['Banane', 'Orange', 'Mangue']

Dans cet exemple,slice(1, -1) commence l'extraction à l'indice1 et s'arrête avant l'élément situé à l'indice-1 (le dernier élément). Cela donne un nouveau tableau['Banana', 'Orange', 'Mango']. La méthodeslice exclut toujours l'élément situé à l'indice final spécifié, qu'il soit positif ou négatif.

lecture depuis le début --->   0     1     2     3     4|     |     |     |     |     ||  S  |  L  |  I  |  C  |  E  ||     |     |     |     |     |  -5    -4    -3    -2    -1<--- lecture depuis la fin

Utiliserslice() avec des tableaux d'objets

Dans l'exemple suivant,slice crée un nouveau tableau,newCar, à partir demyCar. Les deux contiennent une référence à l'objetmyHonda. Lorsque la couleur demyHonda est changée en "purple", les deux tableaux reflètent cette modification.

// Avec slice, créer newCar depuis myCarconst myHonda = {  color: "rouge",  wheels: 4,  engine: { cylinders: 4, size: 2.2 },};const myCar = [myHonda, 2, "excellente condition", "achetée en 1997"];const newCar = myCar.slice(0, 2);console.log("myCar =", myCar);console.log("newCar =", newCar);console.log("myCar[0].color =", myCar[0].color);console.log("newCar[0].color =", newCar[0].color);// Changer la couleur de myHonda.myHonda.color = "bordeaux";console.log("La nouvelle couleur de ma Honda est", myHonda.color);console.log("myCar[0].color =", myCar[0].color);console.log("newCar[0].color =", newCar[0].color);

Ce script affichera :

myCar = [  { color: 'rouge', wheels: 4, engine: { cylinders: 4, size: 2.2 } },  2,  'excellente condition',  'achetée en 1997']newCar = [ { color: 'rouge', wheels: 4, engine: { cylinders: 4, size: 2.2 } }, 2 ]myCar[0].color = rougenewCar[0].color = rougeLa nouvelle couleur de ma Honda est bordeauxmyCar[0].color = bordeauxnewCar[0].color = bordeaux

Appelerslice() sur des objets qui ne sont pas des tableaux

La méthodeslice() lit la propriétélength dethis. Elle lit ensuite les propriétés dont les clés sont des entiers destart àend et les définit sur un nouveau tableau créé.

const objetSimilaireTableau = {  length: 3,  0: 2,  1: 3,  2: 4,  3: 33, // ignoré par slice() car length vaut 3};console.log(Array.prototype.slice.call(objetSimilaireTableau, 1, 3));// [ 3, 4 ]

Utiliserslice() pour convertir des objets semblables à des tableaux en tableaux

La méthodeslice() est souvent utilisée avecbind() etcall() pour créer une méthode utilitaire qui convertit un objet semblable à un tableau en un tableau.

// slice() est appelé en passant `this` comme premier argumentconst slice = Function.prototype.call.bind(Array.prototype.slice);function list() {  return slice(arguments);}const listResult = list(1, 2, 3); // [1, 2, 3]

Utiliserslice() sur des tableaux creux

Le tableau retourné parslice() peut être creux si le tableau source est creux.

console.log([1, 2, , 4, 5].slice(1, 4)); // [2, vide, 4]

Spécifications

Compatibilité des navigateurs

Voir aussi

• Guide des collections indexées
• L'objet globalArray
• La méthodeArray.prototype.pop()
• La méthodeArray.prototype.shift()
• La méthodeArray.prototype.concat()
• La méthodeArray.prototype.splice()
• La méthodeTypedArray.prototype.slice()
• La méthodeString.prototype.slice()
• Prothèse d'émulation deArray.prototype.slice danscore-js^(angl.)
• Prothèse d'émulation es-shims deArray.prototype.slice^(angl.)