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.

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é.


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) { ... }

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;
}

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.


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]]

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

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]]

16

ES6

const [first] = Object.keys(obj)

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]


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é.


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'} )

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'

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'

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));

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
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.