Comment parcourir un tableau d'objet dans Javascript?

Programmation JavaScript
, , , , , , , , , , ,
1

J’essaie de parcourir les éléments du tableau d’objet suivant :

{
    "colors": [{
        "rgb": "255-240-190",
        "hex": "ff3a2e"
    }, {
        "rgb": "188-36-224",
        "hex": "054ffe"
    }]
}

Je veux récupérer les valeurs de rgb et hex.

J’ai déjà essayé :

for (var key in data) {
    var obj = data[key];
    for (var prop in obj) {
        if (obj.hasOwnProperty(prop)) {
            console.log(prop + " = " + obj[prop]);
        }
    }
}

Mais la console affiche [Object].

Une idée comment je peux résoudre ça ?

2

Il paraît que vous avez oublié la propriété « colors » dans data, donc la boucle est probablement en train de parcourir l’objet racine plutôt que le tableau :

for (var key in data.colors) {
    var obj = data.colors[key];
    // ...
}

Sauf si data a été définies comme colors avant l’extrait de code donné.

Par contre, vous devriez envisager de remplacer cette boucle par une boucle for normale pour le tableau :

for (var i = 0, l = data.colors.length; i < l; i++) {
    var obj = data.colors[i];
    // ...
}
3

Je vous recommande de lire les tutoriels suivantes:

4

Vous pouvez utiliser la méthode forEach pour parcourir un tableau d’objet dans Javascript.

data.colors.forEach(function(color){
    console.log(color)
});
5

Dans votre script, data est votre objet entier.

La clé « colors » est un tableau que vous devez parcourir, essayez le code suivant :

for (var key in data) {
    var arr = data[key];
    for (var i = 0; i < arr.length; i++) {
        var obj = arr[i];
        for (var prop in obj) {
            if (obj.hasOwnProperty(prop)) {
                console.log(prop + " = " + obj[prop]);
            }
        }
    }
}