Dans cet article, nous verrons 10 méthodes de tableau javascript importantes qui sont presque nécessaires partout dans les projets javascript. Nous allons rapidement jeter un oeil à chaque méthode avec exemple. Vous trouverez ci-dessous les données avec lesquelles nous allons travailler tout en prenant des exemples de la première méthode 8.

const studentData = [
    { name: 'John', marks: 634, passed: true },
    { name: 'Mark', marks: 467, passed: true },
    { name: 'Randy', marks: 390, passed: true },
    { name: 'Leo', marks: 149, passed: false },
    { name: 'Chris', marks: 564, passed: true },
    { name: 'Apu', marks: 456, passed: true },
    { name: 'Naty', marks: 567, passed: true },
    { name: 'James', marks: 98, passed: false },
    { name: 'Andy', marks: 478, passed: true },
    { name: 'Frank', marks: 180, passed: false },
    { name: 'Don', marks: 123, passed: false }
];

La filter()méthode crée un nouveau tableau avec tous les éléments qui réussissent le test implémenté par la fonction fournie.

const passedStudents = studentData.filter((student) => {
    return student.passed;
});
console.log(passedStudents);

[
{ nom : 'John', notes : 634, passé : vrai },
{ nom : 'Mark', notes : 467, passé : vrai },
{ nom : 'Randy', notes : 390, passé : vrai },
{ nom : 'Chris', notes : 564, passé : vrai },
{ nom : 'Apu', notes : 456, passé : vrai },
{ nom : 'Naty', notes : 567, passé : vrai },
{ nom : 'Andy', notes : 478, réussi : vrai }
]

carte()

La map()méthode crée un nouveau tableau rempli avec les résultats de l'appel d'une fonction fournie sur chaque élément du tableau appelant.

const studentNames = studentData.map((student) => {
    return student.name;
});
console.log(studentNames);

[
'John', 'Mark',
'Randy', 'Leo',
'Chris', 'Apu',
'Naty', 'James',
'Andy', 'Frank',
'Don'
]

trouver()

La find()méthode renvoie la valeur du premier élément du tableau fourni qui satisfait la fonction de test fournie. Si aucune valeur ne satisfait la fonction de test, undefinedest renvoyé.

const dataOfLeo = studentData.find((student) => {
    return student.name === 'Leo';
});
console.log(dataOfLeo);

{ nom : 'Léo', notes : 149, passé : faux }

réduire()

La reduce()méthode exécute une fonction de réduction (que vous fournissez) sur chaque élément du tableau, ce qui donne une valeur de sortie unique.

const totalMarksOfAll = studentData.reduce((currentTotal, student) => {
    return student.marks + currentTotal;
}, 0);
console.log(totalMarksOfAll);

4106

trouverIndex()

La findIndex()méthode renvoie l' indice du premier élément du tableau qui satisfait la fonction de test fournie . Sinon, elle renvoie -1, indiquant qu'aucun élément n'a réussi le test.

const indexOfLeo = studentData.findIndex((student) => student.name === 'Leo');
console.log(indexOfLeo);

3

pour chaque()

La forEach()méthode exécute une fonction fournie une fois pour chaque élément du tableau. Cela fonctionne de la même manière que pour la boucle. Disons que nous voulons imprimer le statut des résultats pour chaque élève, puis

studentData.forEach((student) => {
    console.log(
        `${student.name} has ${
            student.passed ? 'passed' :
            'failed'} !`
    );
});

Jean est passé !
Marc est passé !
Randy est décédé !
Léo a échoué !
Chris est décédé !
Apu est passé !
Naty est décédée !
James a échoué !
Andy est décédé !
Franck a échoué !
Don a échoué !

quelques()

La some()méthode teste si au moins un élément du tableau réussit le test mis en œuvre par la fonction fournie. Elle renvoie vrai si, dans le tableau, elle trouve un élément pour lequel la fonction fournie renvoie vrai ; sinon il renvoie faux. Il ne modifie pas le tableau.

const hasFailedStudents = studentData.some((student) => {
    return !student.passed;
});
console.log(hasFailedStudents);

vrai

tous()

La every()méthode teste si tous les éléments du tableau réussissent le test implémenté par la fonction fournie. Il renvoie une valeur booléenne.

const hasAllPassed = studentData.every((student) => {
    return student.passed;
});
console.log(hasAllPassed);

faux

Nouvelles données

Maintenant, pour les deux méthodes restantes, utilisons les données ci-dessous,

const languages = [
    'java',
    'cpp',
    'python',
    'javascript'
];

La includes()méthode détermine si un tableau inclut une certaine valeur parmi ses entrées, en retournant trueou falseselon le cas.
Disons que nous voulons vérifier si python et ruby ​​sont dans le tableau des langues ci-dessus ou non alors

const includesRuby = languages.includes('ruby');
console.log(includesRuby)
const includesPython = languages.includes('python');
console.log(includesPython);

faux
vrai

Indice de()

La indexOf()méthode renvoie le premier index auquel un élément donné peut être trouvé dans le tableau, ou -1 s'il n'est pas présent.
Disons que nous voulons trouver l'index de python alors

const indexOfPython = languages.indexOf('python');
console.log(indexOfPython);

2