Parcourir un tableau d'objets

Par bezzy, il y a 9 ans

Javascript

Bonjour,

Voila je rencontre un petit problème avec mon code.

Mon petit code

var listHTML var students = [ { name: 'ZOZO', track: 'Javascript fullstack', achievements: 5, points: 1552 }, { name: 'POPO', track: 'Javascript fullstack', achievements: 5, points: 1552 }, { name: 'OHO', track: 'Digital master painting', achievements: 2, points: 225 }, { name: 'POLO', track: 'master science of diets', achievements: 45, points: 55555555 }, { name: 'KUZO', track: 'Master of jobs coach', achievements: 4, points: 2255 }, { name: 'GEKO', track: 'Pedagology', achievements: 45, points: 454545 } ] function print (message) { document.write(message) } function printList (list) { listHTML = '<ul>' for (var i = 0; i < list.length; i++) { for (var student in list) { document.write(list[student]) } } listHTML += '</ul>' document.write(listHTML) } printList(students)

Ce que je veux

Je cherche a parcourir et afficher sous forme de liste les elements d'un tableau d'objets en affichant sous cette forme:

4 réponses

betaWeb, il y a 9 ans

Salut,

function printList (list) { listHTML = '<ul>' for (var i = 0; i < list.length; i++) { for (var student in list) { document.write(list[student].name) } } listHTML += '</ul>' document.write(listHTML) }
Amilor7, il y a 9 ans

Salut, si je comprends bien ce que tu souhaites c'est itérer sur les propriétés de chaque objet et de sortir la clef avec la valeur.
Il y a plusieurs solutions, j'ai utilisé Object.keys() avec un foreach, ce qui nécessite un polyfill, pour plus de doc, cf (Lien MDN)
Exemple : https://jsbin.com/tameko/edit?js,output

Amilor7, il y a 9 ans

Désolé du double post, mais pour t'expliquer ce que tu obtiens c'est simplement un problème de boucle plus un problème pour accéder aux propriétés de l'objet.

function printList (list) { listHTML = '<ul>' for (var i = 0; i < list.length; i++) { // La tu fais une boucle sur le nombre d'objet que ton tableau contient for (var student in list) { // Ici nouvelle boucle sur chaque objet de la liste // Ici tu as accès à l'objet donc tu peux afficher ses propriétés par exemple : // console.log(list[student].name) tu obtiens : ZOZO puis POPO puis OHO etc... document.write(list[student]) // Ceci renvoit object Object car tu ne précise aucune propriété de ton objet } // Enfin le problème de boucle vient du for in dans la boucle for // Quand i vaut 0 ta boucle for in parcours tous les objets de ta liste // Quand i vaut 1 ta boucle for in parcours à nouveau tous les objets de ta liste et ainsi de suite jusqu'a ce que i soit égal au nombre d'élements de ta liste, en l'occurence 5, voilà pourquoi tu obtiens autant d'object Object } listHTML += '</ul>' document.write(listHTML) } printList(students) // Tu fais appel de ta fonction en lui passant ta liste

Désolé si c'est pas très clair

bezzy, il y a 9 ans

@Amilor7 je te remercie pour toutes ces explications. Tu m'a vraiment aidé :)