Principales méthodes des tableaux

7.1 Méthode splice()

Les tableaux en JavaScript offrent des méthodes intégrées pour manipuler les données. Dans cette leçon, nous allons explorer quatre méthodes principales des tableaux: splice(), slice(), concat() et indexOf(). Chacune de ces méthodes effectue des opérations spécifiques sur les tableaux et peut grandement simplifier le traitement des données.

La méthode splice() modifie le contenu d'un tableau en supprimant des éléments existants et/ou en ajoutant de nouveaux éléments à leur place.

Syntaxe:

    
      
       
   
       
   
     splice 
   (start, deleteCount, item1, item2, ...);
    
  

Où:

• start: l'indice à partir duquel commencer les modifications
• deleteCount: le nombre d'éléments à supprimer. Si non spécifié, tous les éléments à partir de la position de départ sont supprimés
• item1, item2, ...: les éléments à ajouter au tableau. Si non spécifié, aucun élément n'est ajouté

Exemple 1: Suppression d'éléments

Dans cet exemple, deux éléments sont supprimés du tableau fruits, à partir de l'indice 2. La valeur retournée est un tableau des éléments supprimés.

    
      let fruits = ['apple', 'banana', 'cherry', 'date', 'fig'];
      let removed = fruits.splice(2, 2);

      console.log(fruits);   // Affiche: ['apple', 'banana', 'fig']
      console.log(removed);  // Affiche: ['cherry', 'date']
    
  

Exemple 2: Ajouter des éléments

Dans cet exemple, deux nouveaux éléments (date et fig) sont ajoutés au tableau fruits à partir de l'indice 2. Aucun élément n'est supprimé.

    
      let fruits = ['apple', 'banana', 'cherry'];
      fruits.splice(2, 0, 'date', 'fig');

      console.log(fruits);   // Affiche: ['apple', 'banana', 'date', 'fig', 'cherry']
    
  

Exemple 3: Remplacement d'éléments

Dans cet exemple, l'élément à l'indice 1 (banana) est remplacé par deux nouveaux éléments (date et fig).

    
      let fruits = ['apple', 'banana', 'cherry'];
      fruits.splice(1, 1, 'date', 'fig');

      console.log(fruits);   // Affiche: ['apple', 'date', 'fig', 'cherry']
    
  

7.2 Méthode slice()

La méthode slice() retourne un nouveau tableau, contenant une copie d'une partie du tableau original. Le tableau original n'est pas modifié.

Syntaxe:

    
      array.slice(begin, end);
    
  

Où:

• begin: l'indice à partir duquel commencer la copie
• end: l'indice jusqu'auquel copier (sans inclure l'élément à cet indice). Si non spécifié, tous les éléments jusqu'à la fin du tableau sont copiés

Exemple 1: Copier une partie d'un tableau

Dans cet exemple, un nouveau tableau est créé, contenant les éléments avec les indices de 1 à 2 du tableau fruits.

    
      let fruits = ['apple', 'banana', 'cherry', 'date', 'fig'];
      let sliced = fruits.slice(1, 3);

      console.log(sliced);   // Affiche: ['banana', 'cherry']
    
  

Exemple 2: Copier depuis le début du tableau

Dans cet exemple, un nouveau tableau est créé, contenant les éléments avec les indices 0 et 1 du tableau fruits.

    
      let fruits = ['apple', 'banana', 'cherry'];
      let sliced = fruits.slice(0, 2);

      console.log(sliced);   // Affiche: ['apple', 'banana']
    
  

Exemple 3: Copier jusqu'à la fin du tableau

Dans cet exemple, un nouveau tableau est créé, contenant les éléments à partir de l'indice 1 jusqu'à la fin du tableau fruits.

    
      let fruits = ['apple', 'banana', 'cherry'];
      let sliced = fruits.slice(1);

      console.log(sliced);   // Affiche: ['banana', 'cherry']
    
  

7.3 Méthode concat()

La méthode concat() est utilisée pour fusionner deux ou plusieurs tableaux. Elle retourne un nouveau tableau, contenant les éléments de tous les tableaux fusionnés.

Syntaxe:

    
      array1.concat(array2, array3, ...);
    
  

Où:

• array1, array2, array3, ...: les tableaux à fusionner

Exemple 1: Fusion de deux tableaux

Dans cet exemple, les tableaux fruits1 et fruits2 sont fusionnés en un nouveau tableau combined.

    
      let fruits1 = ['apple', 'banana'];
      let fruits2 = ['cherry', 'date'];
      let combined = fruits1.concat(fruits2);

      console.log(combined); // Affiche: ['apple', 'banana', 'cherry', 'date']
    
  

Exemple 2: Fusion de plusieurs tableaux

Dans cet exemple, trois tableaux sont fusionnés en un nouveau tableau combined.

    
      let fruits1 = ['apple', 'banana'];
      let fruits2 = ['cherry', 'date'];
      let fruits3 = ['fig', 'grape'];
      let combined = fruits1.concat(fruits2, fruits3);

      console.log(combined); // Affiche: ['apple', 'banana', 'cherry', 'date', 'fig', 'grape']
    
  

Exemple 3: Fusion d'un tableau avec des éléments

Dans cet exemple, les éléments cherry et date sont ajoutés au tableau fruits, créant un nouveau tableau moreFruits.

    
      let fruits = ['apple', 'banana'];
      let moreFruits = fruits.concat('cherry', 'date');

      console.log(moreFruits); // Affiche: ['apple', 'banana', 'cherry', 'date']
    
  

7.4 Méthode indexOf()

La méthode indexOf() retourne le premier indice où un certain élément peut être trouvé dans le tableau, ou -1 si l'élément n'est pas trouvé.

Syntaxe:

    
      array.indexOf(searchElement, fromIndex);
    
  

Où:

• searchElement: l'élément à rechercher
• fromIndex: l'indice à partir duquel commencer la recherche. Si non spécifié, la recherche commence depuis le début du tableau

Exemple 1: Recherche d'un élément dans un tableau

Dans cet exemple, la méthode indexOf() retourne l'indice de l'élément banana dans le tableau fruits.

    
      let fruits = ['apple', 'banana', 'cherry'];
      let index = fruits.indexOf('banana');

      console.log(index); // Affiche: 1
    
  

Exemple 2: Élément non trouvé

Dans cet exemple, la méthode indexOf() retourne -1 car l'élément date n'est pas trouvé dans le tableau fruits.

    
      let fruits = ['apple', 'banana', 'cherry'];
      let index = fruits.indexOf('date');

      console.log(index); // Affiche: -1
    
  

Exemple 3: Recherche d'un élément à partir d'un certain indice

Dans cet exemple, la méthode indexOf() commence à chercher l'élément banana depuis l'indice 2 et le trouve à l'indice 3.

    
      let fruits = ['apple', 'banana', 'cherry', 'banana'];
      let index = fruits.indexOf('banana', 2);

      console.log(index); // Affiche: 3