Obtention du premier index d'un objet

201

Considérer:

var object = {
  foo: {},
  bar: {},
  baz: {}
}

Comment pourrais-je faire ceci:

var first = object[0];
console.log(first);

Évidemment, cela ne fonctionne pas parce que le premier index est nommé foo, non 0.

console.log(object['foo']);

fonctionne, mais je ne sais pas qu'il s'appelle foo. Cela pourrait s'appeler n'importe quoi. Je veux juste le premier.

Ryan Florence
la source

Réponses:

61

Si l'ordre des objets est significatif, vous devez réviser votre schéma JSON pour stocker les objets dans un tableau:

[
    {"name":"foo", ...},
    {"name":"bar", ...},
    {"name":"baz", ...}
]

ou peut-être:

[
    ["foo", {}],
    ["bar", {}],
    ["baz", {}]
]

Comme le souligne Ben Alpert, les propriétés des objets Javascript ne sont pas ordonnées et votre code est cassé si vous vous attendez à ce qu'il les énumère dans le même ordre qu'elles sont spécifiées dans le littéral de l'objet - il n'y a pas de "première" propriété.

Miles
la source
6
Je n'ai jamais vu pour (i in obj) faire les choses dans un ordre différent, dites-vous que parfois pour (i in obj) va expulser les choses dans un ordre différent?
Ryan Florence
4
Il est possible que ce soit le cas. Le cahier des charges indique qu'il ne doit pas être énuméré dans un ordre spécifique. Cela signifie à peu près que cet ordre peut changer.
PatrikAkerstrand
5
De nos jours, la plupart des navigateurs préservent l'ordre d'insertion, mais ce n'était pas toujours le cas; ce n'est pas requis par la spécification, et il y avait des versions récentes de Chrome qui ne préservaient pas l'ordre d'insertion.
Miles
1
Alors que j'approfondissais ce que je faisais, l'ordre des choses devenait plus important (je pensais que je ne me souciais que du premier, mais j'avais tort!), Il était donc clair de stocker mes objets dans un tableau comme vous l'avez suggéré.
Ryan Florence
1
Si vous savez que l'objet n'a qu'un seul élément, alors vous connaissez l'ordre.
danorton
329

Juste pour le plaisir, cela fonctionne dans JS 1.8.5

var obj = {a: 1, b: 2, c: 3};
Object.keys(obj)[0]; // "a"

Cela correspond au même ordre que vous verriez faire

for (o in obj) { ... }
Jacob
la source
24
Clairement la meilleure option à moins que la compatibilité avec les mots clés de l'âge de pierre ne soit requise.
Dag Sondre Hansen
1
100% la meilleure réponse. C'est le moyen le plus simple et le plus rapide de le faire.
Affaire
3
Juste pour clarifier, selon en.wikipedia.org/wiki/JavaScript#Version_history JS 1.8.5 n'est pas pris en charge avant IE9. Malheureusement, beaucoup de gens sont encore à l'âge de pierre.
Noremac
Elle est bonne. Court et simple. Merci @Jacob
Sariban D'Cl
si quelqu'un utilise IE9, je ressens sa douleur. merci c'est incroyable
CMS
204

Si vous voulez quelque chose de concis, essayez:

for (first in obj) break;

alert(first);

encapsulé en fonction:

function first(obj) {
    for (var a in obj) return a;
}
Patrick Hayes
la source
8
Voir la réponse de Luke Schafer ci-dessous, il utilise la méthode hasOwnProperty pour vous assurer de ne pas récupérer les membres du prototype.
Code Commander
3
Pour qu'un seul liner fonctionne dans tous les navigateurs, y compris IE8 et les versions antérieures, for (var key in obj) if (obj.hasOwnProperty(key)) break;vous devrez ensuite utiliser la keyvariable
Ally
ne fonctionne pas si le premier élément est un type d'objet. renvoie 0
neige
Object.keys(obj)[0];est beaucoup plus rapide (0,072 ms) que for(1,644 ms).
Sebastian Ortmann
77

ils ne sont pas vraiment commandés, mais vous pouvez faire:

var first;
for (var i in obj) {
    if (obj.hasOwnProperty(i) && typeof(i) !== 'function') {
        first = obj[i];
        break;
    }
}

il .hasOwnProperty()est important d'ignorer les objets prototypés.

Luke Schafer
la source
Il y a une erreur dans le code ci-dessus. Le chèque typeof doit être typeof (i)
jacob.toye
@ Napalm, il faisait référence à l'erreur dans le nom de la variable en cours de vérification, pas à la syntaxe. Vous avez raison, mais beaucoup de gens aiment le bracketing pour la lisibilité
Luke Schafer
Je vous remercie. C'est incroyable.
Santosh
76

Cela ne vous donnera pas le premier car les objets javascript ne sont pas triés, mais cela convient dans certains cas.

myObject[Object.keys(myObject)[0]]
Rob Fox
la source
39

pour la première clé d'objet que vous pouvez utiliser

console.log(Object.keys(object)[0]);//print key's name

pour la valeur

console.log(object[Object.keys(object)[0]]);//print key's value
jitendra varshney
la source
18

Il n'y a aucun moyen d'obtenir le premier élément, car les "hachages" (objets) en JavaScript ont des propriétés non ordonnées. Votre meilleur pari est de stocker les clés dans un tableau:

var keys = ["foo", "bar", "baz"];

Utilisez ensuite cela pour obtenir la valeur appropriée:

object[keys[0]]
Sophie Alpert
la source
16

ES6

const [first] = Object.keys(obj)
Richard Ayotte
la source
Cela fonctionne, mais pouvez-vous expliquer comment cela fonctionne? Le simple fait de montrer le code ne me permet pas de le comprendre.
Daan
1
C'est une mission déstructurante . Essentiellement, il affecte le premier élément du tableau renvoyé à la variable entre crochets.
Richard Ayotte
12

En utilisant le soulignement, vous pouvez utiliser _.pairs pour obtenir la première entrée d'objet comme paire de valeurs clés comme suit:

_.pairs(obj)[0]

La clé serait alors disponible avec un [0]indice supplémentaire , la valeur avec[1]

Dexygen
la source
Fonctionne mieux lorsque underscore.js est utilisé. Juste ce dont j'avais besoin ... Merci, George!
Goldengalaxy
10

J'ai eu le même problème hier. Je l'ai résolu comme ceci:

var obj = {
        foo:{},
        bar:{},
        baz:{}
    },
   first = null,
   key = null;
for (var key in obj) {
    first = obj[key];
    if(typeof(first) !== 'function') {
        break;
    }
}
// first is the first enumerated property, and key it's corresponding key.

Ce n'est pas la solution la plus élégante, et je suis à peu près sûr qu'elle peut donner des résultats différents dans différents navigateurs (c'est-à-dire que les spécifications indiquent que l'énumération n'est pas requise pour énumérer les propriétés dans le même ordre qu'elles ont été définies). Cependant, je n'avais qu'une seule propriété dans mon objet, ce n'était donc pas un problème. J'avais juste besoin de la première clé.

PatrikAkerstrand
la source
1
Bonjour @PatrikAkerstrand tôt, j'ai accidentellement cliqué sur downvote. Veuillez apporter toute modification dans votre réponse à Je l'annule. Désolé.
rogeriolino
7

Vous pouvez faire quelque chose comme ça:

var object = {
    foo:{a:'first'},
    bar:{},
    baz:{}
}


function getAttributeByIndex(obj, index){
  var i = 0;
  for (var attr in obj){
    if (index === i){
      return obj[attr];
    }
    i++;
  }
  return null;
}


var first = getAttributeByIndex(object, 0); // returns the value of the
                                            // first (0 index) attribute
                                            // of the object ( {a:'first'} )
CMS
la source
6

Pour obtenir la première clé de votre objet

const myObject = {
   'foo1': { name: 'myNam1' },
   'foo2': { name: 'myNam2' }
}

const result = Object.keys(myObject)[0];

// result will return 'foo1'
ldls
la source
Quelle est la différence de cette réponse avec celle de Jacob?
YakovL
il donne confiance au plus frais que ce type de code fonctionne parfaitement.
Santosh
5

Basé sur la réponse du CMS . Je n'obtiens pas la valeur directement, au lieu de cela je prends la clé à son index et l'utilise pour obtenir la valeur:

Object.keyAt = function(obj, index) {
    var i = 0;
    for (var key in obj) {
        if ((index || 0) === i++) return key;
    }
};


var obj = {
    foo: '1st',
    bar: '2nd',
    baz: '3rd'
};

var key = Object.keyAt(obj, 1);
var val = obj[key];

console.log(key); // => 'bar'
console.log(val); // => '2nd'
yckart
la source
2

Ma solution:

Object.prototype.__index = function(index)
{
    var i = -1;
    for (var key in this)
    {
        if (this.hasOwnProperty(key) && typeof(this[key])!=='function')
            ++i;
        if (i >= index)
            return this[key];
    }
    return null;
}
aObj = {'jack':3, 'peter':4, '5':'col', 'kk':function(){alert('hell');}, 'till':'ding'};
alert(aObj.__index(4));
bricolage
la source
12
gentil, seulement… votre style de codage! que se passe-t-il? ces accolades sont partout!
vol de moutons
2
Connaissez-vous le style python? Je viens d'ajouter des accolades alignées verticalement dans un style python. Quoi qu'il en soit, "L'enfer c'est les autres", :-D
diyism