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

186

Si j'ai un objet JS comme:

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

Si je sais que cela fooa cette structure clé / valeur de base, 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 ...

sprugman
la source
5
qu'est-ce qui ne va pas pour ... dans?
Matt
1
Cela semble indirect et vous devez utiliser hasOwnProperty. Je suppose que je vais créer une fonction de bibliothèque qui le fait ....
sprugman

Réponses:

93

Si vous souhaitez obtenir toutes les clés, ECMAScript 5 est introduitObject.keys . Ceci n'est pris en charge que par les navigateurs plus récents, mais la documentation MDC fournit une implémentation alternative (qui utilise également for...inbtw):

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...inc'est la seule solution raisonnable.

Félix Kling
la source
pme donne la clé mais comment puis-je obtenir la valeur de la clé? Merci.
Si8
1
Pour les clés et les valeurs, utilisez le nouvel Object.entries () developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…
Kzqai
c'est peut-être une indication de ma compréhension limitée, mais cette réponse semble incroyablement verbeuse (certes réutilisable) pour quelque chose d'aussi simple que d'obtenir une clé / valeur. La réponse @Michael Bénin ne devrait-elle pas être marquée comme la meilleure?
Aaron Matthews
7
Euh ... quelqu'un d'autre qui clique sur le premier lien est-il redirigé vers les stupéfiants anonymes?
John Duskin
193

Vous itérez à l'intérieur de 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
  });
Michael Bénin
la source
Et si je ne veux foo[i]pas l'être "_proto_"?
user2284570
Et si je ne veux pas alerter () foo[i]si ic'est le cas some string?
user2284570
@ user2284570: je peux être une chaîne - pas de problème.
Gerfried
ne veux-tu pas dire pour (var i in Object.keys (foo)) {
samurai jack
103

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
utilisateur01
la source
3
Vous pouvez maintenant utiliser l'opérateur de propagation à cet effet, cela a l'air mieux: const [firstKey, ...rest] = Object.keys(obj);
Nerlin
65

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

Aryeh Beitz
la source
27

Une seule doublure 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
theonelucas
la source
26

C'est la manière la plus simple et la plus simple. Voilà comment nous procédons.

var obj = { 'bar' : 'baz' }
var key = Object.keys(obj)[0];
var value = obj[key];
     
 console.log("key = ", key) // bar
 console.log("value = ", value) // baz
Object.keys () est une méthode javascript qui renvoie un tableau de clés lors de l'utilisation sur des objets.

Object.keys(obj) // ['bar']

Vous pouvez maintenant itérer sur les objets et accéder aux valeurs comme ci-dessous-

Object.keys(obj).forEach( function(key) {
  console.log(obj[key]) // baz
})
Mustkeem K
la source
Vous pouvez obtenir TypeErrorsi vous vous attendez à ce qu'une clé soit un nombre. Parce que les clés sont toujours des chaînes.
Vert
15

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;
Chris
la source
11
pourquoi pas var value = person[key];? De cette façon, vous n'avez pas besoin de connaître la clé de la valeur que vous souhaitez extraire.
Sean Kendle
14
// 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"
}

Référez MDN

aiffin
la source
9

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

patapizza
la source
5

Le moyen le plus simple est d'utiliser simplement Underscore.js:

clés

_.keys (object) Récupère 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!

Samnau
la source
4
@lonesomeday oui, mais les traits de soulignement / lodash sont utiles à bien d'autres égards, donc cela vaut la peine d'en parler.
jcollum
4

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'}, ...]
Jamie Treworgy
la source
4

Depuis que vous l'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;
});
Dave Ward
la source
4

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

var arr1 = Object.keys(obj);

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

var arr2 = Object.values(obj);

Pour en savoir plus, rendez-vous ici

jesusverma
la source
3

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 cette sortie:

[bar];

jitendra varshney
la source
1

Eh bien, $.eachc'est une construction de bibliothèque, alors que for ... inc'est js natif, qui devrait être mieux

Naftali alias Neal
la source
1

Vous pouvez utiliser la fonctionnalité Object.keys pour obtenir les clés telles que:

const tempObjects={foo:"bar"}

Object.keys(tempObjects).forEach(obj=>{
   console.log("Key->"+obj+ "value->"+tempObjects[obj]);
});
Akarsh Srivastava
la source
0

pour afficher sous forme de chaîne, utilisez simplement:

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

meilleure façon d'obtenir la clé / valeur de l'objet.

let obj = {
        'key1': 'value1',
        'key2': 'value2',
        'key3': 'value3',
        'key4': 'value4'
    }
    Object.keys(obj).map(function(k){ 
    console.log("key with value: "+k +" = "+obj[k])    
    
    })
    

Sahil Ralkar
la source