web-dev-qa-db-fra.com

Comment obtenir la collection de clés dans le dictionnaire javascript?

J'ai un dictionnaire:

var driversCounter = {
 "one": 1, 
 "two": 2, 
 "three": 3, 
 "four": 4, 
 "five": 5
}

Maintenant, je dois le montrer dans la liste déroulante. Comment obtenir une collection de clés dans mon dictionnaire?

80
FreeVice

Utilisez Object.keys() ou shim dans les anciens navigateurs ...

const keys = Object.keys(driversCounter);

Si vous vouliez des valeurs , il y a Object.values() et si vous voulez une clé et valeur, vous pouvez utiliser Object.entries() , souvent associé à Array.prototype.forEach() comme ceci ...

Object.entries(driversCounter).forEach(([key, value]) => {
   console.log(key, value);
});

Sinon, compte tenu de votre cas d'utilisation, peut-être que cela le fera ...

var selectBox, option, prop;

selectBox = document.getElementById("drivers");

for (prop in driversCounter) {
   option = document.createElement("option");
   option.textContent = prop;
   option.value = driversCounter[prop];
   selectBox.add(option);
}
124
alex

Une option utilise Object.keys() :

Object.keys(driversCounter)

Cela fonctionne très bien pour les navigateurs modernes (cependant, IE le prend en charge à partir de la version 9 uniquement).

Pour ajouter un support compatible, vous pouvez copier l'extrait de code fourni dans MDN .

54
VisioN

pour parcourir le "dictionnaire" (on l'appelle objet en JS), utilisez un for in boucle:

for(var key in driversCounter) {
    if(driversCounter.hasOwnProperty(key)) {
        //key                 = keys,  left of the ":"
        //driversCounter[key] = value, right of the ":"
    }
}
19
Joseph

Cela fonctionnera dans toutes les implémentations JavaScript:

var keys = [];

for (var key in driversCounter) {
    if (driversCounter.hasOwnProperty(key)) {
        keys.Push(key);
    }
}

Comme d'autres mentionnés précédemment, vous pouvez utiliser Object.keys, mais cela peut ne pas fonctionner avec les moteurs plus anciens. Donc, vous pouvez utiliser le patch de singe suivant:

if (!Object.keys) {
    Object.keys = function (object) {
        var keys = [];

        for (var key in object) {
            if (object.hasOwnProperty(key)) {
                keys.Push(key);
            }
        }
    }
}
9
Aadit M Shah

utiliser Object.Keys()

var driversCounter = {
                      "one": 1,
                      "two": 2,
                      "three": 3,
                      "four": 4,
                      "five": 5
                     }
console.log(Object.keys(driversCounter));
5
Amil Sajeev

Avec un moteur JS moderne, vous pouvez utiliser Object.keys(driversCounter)

3
ThiefMaster

pour les nouveaux navigateurs: Object.keys( MY_DICTIONARY ) retournera un tableau de clés. Sinon, vous voudrez peut-être aller à l'ancienne façon:

var keys = []
for(var key in dic) keys.Push( key );
3
Parth Thakkar

Comme d'autres l'ont déjà dit, vous pourriez utiliser Object.keys(), mais qui se soucie des anciens navigateurs, n'est-ce pas?

Eh bien, je fais.

Essayez this . array_keys depuis les ports PHPJS PHP à portée de main array_keys fonctionne pour pouvoir être utilisé dans JS. En bref, il utilise Object.keys _ si supporté, mais gère le cas où ce n'est pas très facile. Il inclut même le filtrage des clés en fonction des valeurs que vous recherchez peut-être (facultatif) et une bascule vous permettant d’utiliser ou non la comparaison stricte === Comparaison de conversion de typographie == (optionnel)

1

si vous pouvez utiliser JQuery alors

var keys = []; 
$.each(driversCounter, function(key, value) { 
    keys.Push(key); 
}); 

console.log(JSON.stringify(keys));

voici la réponse:

["one","two","three","four","five"]

et de cette façon, vous n’auriez pas à vous inquiéter si le navigateur supporte Object.keys méthode ou non.

1
Darius Kucinskas