web-dev-qa-db-fra.com

meilleur moyen d'obtenir la clé d'un objet javascript clé/valeur

Si j'ai un objet JS comme:

var foo = { 'bar' : 'baz' }

Si je sais que foo a cette structure de base clé/valeur, mais que je ne connais pas le nom de la clé, quel est le moyen le plus simple de l'obtenir? for ... in? $.each()? J'espère qu'il y a quelque chose de mieux ....

134
sprugman

Si vous voulez obtenir toutes les clés, ECMAScript 5 a introduit Object.keys . Ceci n'est supporté que par les nouveaux navigateurs mais la documentation MDC fournit une implémentation alternative (qui utilise également for...in btw):

if(!Object.keys) Object.keys = function(o){
     if (o !== Object(o))
          throw new TypeError('Object.keys called on non-object');
     var ret=[],p;
     for(p in o) if(Object.prototype.hasOwnProperty.call(o,p)) ret.Push(p);
     return ret;
}

Bien sûr, si vous voulez les deux, clé et valeur, alors for...in est la seule solution raisonnable.

76
Felix Kling

Vous pouvez parcourir l'objet avec une boucle for:

for(var i in foo){
  alert(i); // alerts key
  alert(foo[i]); //alerts key's value
}

Ou

Object.keys(foo)
  .forEach(function eachKey(key) { 
    alert(key); // alerts key 
    alert(foo[key]); // alerts value
  });
145
Michael Benin

Vous pouvez accéder à chaque clé individuellement sans itérer, comme dans:

var obj = { first: 'someVal', second: 'otherVal' };
alert(Object.keys(obj)[0]); // returns first
alert(Object.keys(obj)[1]); // returns second
84
user01

Compte tenu de votre objet:

var foo = { 'bar' : 'baz' }

Pour obtenir bar, utilisez:

Object.keys(foo)[0]

Pour obtenir baz, utilisez:

foo[Object.keys(foo)[0]]

En supposant un seul objet

44
Aryeh Beitz

J'avais le même problème et c'est ce qui a fonctionné

//example of an Object
var person = {
    firstName:"John",
    lastName:"Doe",
    age:50,
    eyeColor:"blue"
};

//How to access a single key or value
var key = Object.keys(person)[0];
var value = person.firstName;
14
Chris
// iterate through key-value gracefully
const obj = { a: 5, b: 7, c: 9 };
for (const [key, value] of Object.entries(obj)) {
  console.log(`${key} ${value}`); // "a 5", "b 7", "c 9"
}

Se référer MDN 

8
aiffin

Je ne vois rien d'autre que for (var key in foo).

7
patapizza

C'est le moyen le plus simple et facile. C'est comme ça qu'on fait ça.

var obj = { 'bar' : 'baz' }
var key = Object.keys(obj)[0];
var value = obj[key];
     
 console.log("key = ", key) // bar
 console.log("value = ", value) // baz

7
Must Keem J

Un un liner pour vous:

const OBJECT = {
    'key1': 'value1',
    'key2': 'value2',
    'key3': 'value3',
    'key4': 'value4'
};

const value = 'value2';

const key = Object.keys(OBJECT)[Object.values(OBJECT).indexOf(value)];

window.console.log(key); // = key2
6
Theone Lucas

Le plus simple est d’utiliser Underscore.js:

clés

_.keys (objet) Récupérer tous les noms des propriétés de l'objet.

_.keys ({un: 1, deux: 2, trois: 3}); => ["un", "deux", "trois"]

Oui, vous avez besoin d'une bibliothèque supplémentaire, mais c'est tellement simple!

4
samnau

Il n'y a pas d'autre moyen que for ... in. Si vous ne voulez pas utiliser cela (peut-être parce qu'il est légèrement inefficace de devoir tester hasOwnProperty à chaque itération?), Utilisez une construction différente, par exemple un tableau de kvp:

[{ key: 'key', value: 'value'}, ...]
4
Jamie Treworgy

Puisque vous avez mentionné $.each(), voici une approche pratique qui fonctionnerait dans jQuery 1.6+:

var foo = { key1: 'bar', key2: 'baz' };

// keys will be: ['key1', 'key2']
var keys = $.map(foo, function(item, key) {
  return key;
});
3
Dave Ward

Object.keys () La méthode Object.keys () renvoie un tableau des propriétés énumérables propres à un objet donné, dans le même ordre que celui fourni par une boucle for ... in (la différence étant que une boucle for-in énumère également les propriétés de la chaîne de prototypes).

var arr1 = Object.keys(obj);

Object.values ​​() La méthode Object.values ​​() renvoie un tableau des valeurs de propriété énumérables propres à un objet donné, dans le même ordre que celui fourni par une boucle for ... in (la différence étant une boucle for-in énumère également les propriétés de la chaîne de prototypes).

var arr2 = Object.values(obj);

Pour plus s'il vous plaît aller ici

3
jesusverma

utiliser pour chaque boucle pour accéder aux clés dans Object ou Maps en javascript

for(key in foo){
   console.log(key);//for key name in your case it will be bar
   console.log(foo[key]);// for key value in your case it will be baz
}

Remarque: vous pouvez également utiliser 

Object.keys (foo);

cela vous donnera comme ceci sortie:

[bar];

2
jitendra varshney

Bien $.each est une construction de bibliothèque, alors que for ... in est un js natif, ce qui devrait être meilleur

1
Neal

pour afficher en tant que chaîne, utilisez simplement:

console.log("they are: " + JSON.stringify(foo));
0
Jiulong Zhao