En tant que développeur JavaScript, j'ai souvent trouvé deux méthodes Array un peu difficiles à comprendre/complètement
J'ai donc décidé d'approfondir et de décomposer ces méthodes avec des exemples clairs.
Si je réécris la syntaxe
Array.slice
returns the deleted elements in a form of Array = Array.prototype.slice(startIndex, endIndex-1);
Array.splice (P pour Permanent - Rappelez-vous toujours)
La méthode splice en JavaScript modifie le contenu d'un tableau en supprimant ou remplaçant des éléments existants et/ou en ajoutant de nouveaux éléments en place
Suppression de la syntaxe de l'élément
returns the deleted elements in a form of Array = Array.prototype.splice(startIndex, endIndex-1); // permanent
Ajout d'une syntaxe d'élément
array.splice(startIndex, 0, item1, item2, ..., itemX);
REMARQUE :-
Il modifie le tableau d'origine et renvoie le tableau supprimé.
Lorsqu'il se comporte comme une opération d'ajout, il renvoie [] car il ne supprime rien.
voyons quelques exemples :-
Q1. Exercice 1 - Utiliser slice pour obtenir une partie d'un tableau : Créez un tableau de nombres de 1 à 10. Utilisez la méthode slice pour obtenir un nouveau tableau comprenant des nombres de 4 à 8.
const arr = Array.from(Array(10), (_, i) => i+1); console.log('Array --> ', arr); console.log('get a new array that includes numbers from 4 to 8 --> ', arr.slice(3, 8)); // Array.prototype.slice(startIndex, endIndex-1); // [ 4, 5, 6, 7, 8 ]
Q2. Exercice 2 - Utiliser splice pour supprimer des éléments d'un tableau : Créez un tableau de fruits. Utilisez la méthode d'épissage pour supprimer « pomme » et « banane » du tableau.
const fruits = ['apple', 'banana', 'orange', 'mango', 'kiwi']; fruits.splice(0, 2)// permanent console.log('splice method to remove "apple" and "banana" from the array. --> ', fruits); // [ 'orange', 'mango', 'kiwi' ]
Q3. Exercice 3 - Utiliser splice pour ajouter des éléments à un tableau : Créez un tableau de couleurs. Utilisez la méthode d'épissage pour ajouter « rose » et « violet » après « rouge ».
const colors = ['red', 'green', 'blue']; const y = colors.splice(1, 0, "pink", "purple"); / console.log(y); // [] see above to see why. console.log('splice method to add "pink" and "purple" after "red" --> ', colors) // [ 'red', 'pink', 'purple', 'green', 'blue' ]
Q4. Exercice 4 - Utilisation conjointe de slice et splice : créez un tableau de lettres de « a » à « e ». Utilisez slice pour obtenir un nouveau tableau des trois premières lettres. Utilisez ensuite splice sur le tableau d'origine pour supprimer ces lettres.
const letters = ['a', 'b', 'c', 'd', 'e']; const newSlice = letters.slice(0, 3); const x = letters.splice(0, 3); console.log(x); console.log('slice to get a new array of the first three letters --> ', newSlice) // [ 'a', 'b', 'c' ] console.log('Then use splice on the original array to remove these letters --> ', letters)[ 'd', 'e' ]
N'hésitez pas à me contacter si vous avez des questions/préoccupations.
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!