Dans cet article, nous découvrirons les méthodes de tableau Javascript couramment utilisées qui utilisent la fonction d'itération et de rappel pour archiver leurs fonctionnalités.

l'itération fait référence à l'exécution répétée d'un ensemble d'instructions ou de blocs de code, ce qui nous permet d'effectuer la même opération plusieurs fois.

En termes simples, un rappel est une définition de fonction passée en argument à une autre fonction.

Pour faire simple, nous allons nous concentrer sur ces trois points.

1. Quand une méthode de tableau particulière doit être utilisée.
2. Ce que renvoie la méthode array.
3. exemple de code de la méthode array. **

Avant de continuer, comprenons comment ces méthodes de tableau sont structurées.

// Méthode Array(callback(la condition que nous voulons exécuter sur chaque élément de notre tableau))

Chacune de ces méthodes tableau est une fonction qui reçoit un rappel en argument, c'est dans ce rappel que nous précisons les conditions que nous voulons exécuter sur chacun de nos éléments du tableau.

Nous utiliserons ce tableau d'objets pour nos exemples.

`données const = [
{
"IDutilisateur": 1,
"nom d'utilisateur": "Francis",
"message": "Hé, comment ça va ?",
"horodatage": "2024-02-18T12:30:00Z",
"statut": "en ligne",
"messageEnvoyé": 28,
"rôle": "utilisateur",
"passCode": "293087O7764"

},
{
"IDutilisateur": 2,
"nom d'utilisateur": "Moïse",
"message": "Pas mal, je travaille juste sur un projet.",
"horodatage": "2024-02-18T12:35:00Z",
"statut": "absent",
"messageEnvoyé": 74,
"rôle": "utilisateur",
"passCode": "675147O2234"
},
{
"IDutilisateur": 3,
"nom d'utilisateur": "Vicky",
"message": "Hé les amis ! Quels sont les derniers potins ?",
"horodatage": "2024-02-18T12:40:00Z",
"statut": "en ligne",
"messageEnvoyé": 271,
"role": "modérateur",
"passCode": "76352O8069"

},
{
"IDutilisateur": 4,
"nom d'utilisateur": "Junior",
"message": "Pas grand chose, juste pour me détendre. Et toi ?",
"horodatage": "2024-02-18T12:45:00Z",
"status": "hors ligne",
"messageEnvoyé": 125,
"rôle": "administrateur",
"passCode": "21876O3483"
}
]`

forEach : forEach est utilisé lorsque nous voulons exécuter une condition sur tous les éléments de notre tableau. forEach renvoie undéfini.

fonction getMessageSent (utilisateurs){
laissez sumMessageSent = 0;
utilisateurs.forEach(fonction(utilisateur){
sumMessageSent = user.messageSent;
})
retourner sumMessageEnvoyé;
}
getMessageSent(data) // sortie : 498

reduce : réduire est utilisé pour réduire un tableau à une seule valeur, par exemple ce tableau [8, 7, 3] peut être réduit au nombre 18. un réducteur renvoie une seule valeur.

La fonction réducteur prend en compte deux paramètres d'abord le réducteur (qui est composé du total et du courant) et ensuite la valeur initiale

Le total : c'est ce qu'on appelle communément l'accumulateur. le total comme je l'appelle est la dernière valeur calculée de la fonction réductrice.

Le courant fait référence à un seul élément du tableau. dans notre cas, nous avons quatre éléments (actuels).

La valeur initiale est la valeur que nous attribuons au total lors du premier appel. dites simplement que initalValue est la valeur par défaut du total

const getMessageSent = (utilisateurs) => {
return users.reduce((total, current) => total = current.messageSent, 0)
}

getMessageSent(data) // sortie : 498

filter : Array.filter est utilisé lorsque nous souhaitons collecter uniquement les éléments du tableau qui répondent à une condition spécifique. array.filter renvoie un tableau.

const onlineUsers = (utilisateurs) => {
return users.filter(user => user.status === "online")
}

onlineUsers(data) // sortie : [objet objet]

find Array.find est utilisé lorsque nous voulons obtenir uniquement le premier élément du tableau qui répond à la condition définie dans le rappel. array.find renvoie le premier élément PAS dans un tableau mais dans le format de l'élément, dans notre cas, ce sera un objet ou un objet indéfini si aucune correspondance n'a été trouvée.

const getUserRole = (utilisateurs) => {
return utilisateurs.find(user => user.role === "user")
}

getUserRole(data) // sortie : {userId : 1, nom d'utilisateur : 'Francis', message : "Hé, comment ça va ?", horodatage : '2024-02-18T12:30:00Z', statut : ' en ligne', …}

Remarquez que seul le premier utilisateur répondant à la condition a été renvoyé.

map Array.map est utilisé lorsque nous voulons transformer les éléments du tableau. array.map renvoie un tableau d'éléments transformés qui satisfont à la condition de notre rappel.

const getUserNameAndPass = (utilisateurs) => {
return utilisateurs.map((utilisateur) => {
const userPassCode = user.passCode.slice(-4);
return${user.username} ${userPassCode.padStart(
utilisateur.passCode.length,
"★"
)};
});
};

getUserNameAndPass(data)// sortie :['Francis ★★★★★★★7764', 'Moses ★★★★★★★2234', 'Vicky ★★★★★★8069', 'Junior ★ ★★★★★3483']

every array.every est utilisé lorsque nous voulons vérifier si tous les éléments du tableau ont satisfait à notre condition définie. array.every renvoie un booléen. vrai si tous les éléments satisfont à la condition et faux si l'un des éléments échoue à la condition.

const isOnline = data.every(user => dataItem.status === 'online')

console.log(isOnline) // sortie :false

Some array.some est utilisé lorsque nous voulons vérifier que certains éléments du tableau satisfont à une condition donnée. array.some renvoie un booléen. vrai si certains des éléments ont réussi la condition et faux si tous les éléments réussissent ou échouent.

const isOnline = data.every(user => dataItem.status === 'online')

console.log(isOnline) // sortie : vrai

Voici quelques-unes des méthodes de tableau les plus utilisées.