Rechercher un élément dans le tableau JavaScript

Objectifs

• Être capable de rechercher un élément dans un tableau en JavaScript

Modification d'un élément

• Il existe de nombreux moyens permettant de trouver des objets dans Arrays en JavaScript. Vous pouvez toujours recourir à la basique for pour boucler, mais il existe de nombreuses méthodes pour boucler le tableau et trouver facilement ce dont vous avez besoin.
• Dans ce tutoriel, nous allons vous montrer comment utiliser les méthodes JavaScript indexOf(), lastIndexOf(), filter() et find() pour trouver la position d'un élément dans un tableau.

La méthode indexOf() de tableau JavaScript

• La méthode indexOf () compare un élément recherché aux éléments contenus dans le tableau en utilisant une égalité stricte (la même méthode utilisée par l'opérateur ===).
• Pour trouver la position d'un élément dans un tableau , vous utilisez la méthode indexOf(). Cette méthode renvoie l'index de la première occurrence de l'élément que vous souhaitez rechercher, ou -1 si l'élément est introuvable.

• Syntaxe de la méthode indexOf()

  • array.indexOf(élémentRecherché, indiceDébut)

• Paramètres de la méthode indexOf()

  • élémentRecherché
    • Représente l'élément qu'on cherche dans le tableau
  • indiceDébut Facultatif
    • L'index à partir duquel commencer la recherche. La valeur par défaut est 0 (le tableau sera parcouru dans sa totalité). Si l'index est plus grand ou égal à la longueur du tableau, la méthode renverra -1. Si l'index est négatif, la recherche commencera d'autant d'éléments, à partir de la fin du tableau.
    • À noter que même si l'index est négatif, la recherche s'effectue toujours du début jusqu'à la fin du tableau.
    • Si l'index fourni est inférieur à 0, le tableau sera entièrement parcouru.

• Exemple

  • Supposons que vous avez un tableau scores composé de six nombres comme suit:

  • var scores = [10, 20, 30, 10, 40, 20];

  • L'exemple suivant utilise la méthode indexOf() pour rechercher les éléments du tableau scores :

  document.write (scores.indexOf(10)); //Affiche  0
  document.write (scores.indexOf(30)); //Affiche 2
  document.write (scores.indexOf(50)); //Affiche -1
  document.write (scores.indexOf(20)); //Affiche 1

Trouver toutes les occurences d'un élément

• Dans l'exemple qui suit, on utilise indexOf() afin de trouver tous les indices d'un élément dans un tableau.
• On peut utiliser la méthode push afin d'ajouter ces indices dans un autre tableau.

<script>
    var indices_element = [];
    var scores = [10, 20, 30, 10, 40, 20];
    var element = 10;
    var idE = scores.indexOf(element);
    
    while (idE != -1) {       
        indices_element.push(idE);
        idE = scores.indexOf(element, idE + 1);
    }
    document.getElementById('demo').innerHTML=indices_element;
    //console.log(indices_element);
</script>

Ajouter un élément à un tableau s'il n'existe pas

var mon_tableau = ['Nour', 'Salah', 'Mourad', 'Alexendar', 'Lamia', 'Sabrine'];
console.log(mon_tableau );

function mettreAJourTableau(tableau, element) {
    if (tableau.indexOf(element) === -1) {
        tableau.push(element);
        console.log('Le nouveau tableau est : ' + tableau);
    } else if (tableau.indexOf(element) > -1) {
        console.log(element + ' existe déjà dans le tableau.');
    }
}
mettreAJourTableau(mon_tableau, "Soulayma");
// Le nouveau tableau est : ["Nour", "Salah", "Mourad", "Alexendar", "Lamia", "Sabrine", "Soulayma"]
mettreAJourTableau(mon_tableau, 'Mourad');
// Le nom Mourad existe déjà dans le tableau.

La méthode lastIndexOf() de tableau JavaScript

• La méthode lastIndexOf() renvoie la position de la dernière occurrence d'une valeur spécifiée dans une chaîne.

• Syntaxe de la méthode lastIndexOf()

  • array.lastIndexOf(élémentRecherché, indiceDébut)

• Paramètres de la méthode lastIndexOf()

  • élémentRecherché
    • Représente l'élément qu'on cherche dans le tableau
  • indiceDébut Facultatif
    • Optionnel. La position où commencer la recherche (recherche en arrière). Si omis, la valeur par défaut est la longueur de la chaîne