web-dev-qa-db-fra.com

Comment accéder à la première propriété d'un objet en Javascript?

Existe-t-il un moyen élégant d'accéder à la première propriété d'un objet ...

  1. où vous ne connaissez pas le nom de vos propriétés
  2. sans utiliser une boucle comme for .. in ou $.each de jQuery

Par exemple, je dois accéder à l'objet foo1 sans connaître le nom de foo1:

var example = {
    foo1: { /* stuff1 */},
    foo2: { /* stuff2 */},
    foo3: { /* stuff3 */}
};
javascriptobject
474
atogle
var obj = { first: 'someVal' };
obj[Object.keys(obj)[0]]; //returns 'someVal'

En utilisant cela, vous pouvez également accéder à d'autres propriétés par index. Sois conscient que! L'ordre de retour Object.keys n'est pas garanti selon ECMAScript, mais officieusement, il est lu par toutes les principales implémentations de navigateurs. Veuillez lire https://stackoverflow.com/a/23202095 pour plus de détails.

1157
Grzegorz Kaczan

Essayez la boucle for … in et coupez après la première itération:

for (var prop in object) {
    // object[prop]
    break;
}
97
Gumbo

Utilisez Object.keys pour obtenir un tableau des propriétés d'un objet. Exemple:

var example = {
    foo1: { /* stuff1 */},
    foo2: { /* stuff2 */},
    foo3: { /* stuff3 */}
};

var keys = Object.keys(example); // => ["foo1", "foo2", "foo3"] (Note: the order here is not reliable)

Documentation et cale inter-navigateur fournies ici . Un exemple de son utilisation peut être trouvé dans une autre de mes réponses ici .

Edit: pour plus de clarté, je veux juste faire écho à ce qui a été correctement énoncé dans d'autres réponses: l'ordre des clés dans les objets javascript est indéfini.

43
benekastah

Vous pouvez également faire Object.values(example)[0].

27
garrettmaring

Il n'y a pas de "première" propriété. Les clés d'objet ne sont pas ordonnées.

Si vous les parcourez avec pour (var foo in bar), vous les obtiendrez dansquelqueordre, mais cela pourrait changer à l'avenir (surtout si vous ajoutez ou supprimez d'autres clés).

20
Quentin

Une version à une règle:

var val = example[function() { for (var k in example) return k }()];
20
netiul

Un objet littéral, tel que défini par MDC est:

une liste de zéro ou plusieurs paires de noms de propriété et des valeurs associées d'un objet, entourées d'accolades ({}).

Par conséquent, un objet littéral n'est pas un tableau et vous pouvez uniquement accéder aux propriétés à l'aide de leur nom explicite ou d'une boucle for à l'aide du mot clé in.

9
Alex Rozanski

Solution avec lodash bibliothèque:

_.find(example) // => {name: "foo1"}

mais l'ordre de stockage interne des propriétés de l'objet n'est pas garanti, car il dépend de la mise en œuvre de javascript VM.

7
pocheptsov

Je ne vous recommande pas d'utiliser Object.keys car il n'est pas pris en charge dans les anciennes versions IE. Mais si vous en avez vraiment besoin, vous pouvez utiliser le code ci-dessus pour garantir la compatibilité avec le dos:

if (!Object.keys) {
Object.keys = (function () {
var hasOwnProperty = Object.prototype.hasOwnProperty,
    hasDontEnumBug = !({toString: null}).propertyIsEnumerable('toString'),
    dontEnums = [
      'toString',
      'toLocaleString',
      'valueOf',
      'hasOwnProperty',
      'isPrototypeOf',
      'propertyIsEnumerable',
      'constructor'
    ],
    dontEnumsLength = dontEnums.length;

return function (obj) {
  if (typeof obj !== 'object' && typeof obj !== 'function' || obj === null) throw new TypeError('Object.keys called on non-object');

  var result = [];

  for (var prop in obj) {
    if (hasOwnProperty.call(obj, prop)) result.Push(prop);
  }

  if (hasDontEnumBug) {
    for (var i=0; i < dontEnumsLength; i++) {
      if (hasOwnProperty.call(obj, dontEnums[i])) result.Push(dontEnums[i]);
    }
  }
  return result;
}})()};

Fonctionnalité Firefox (Gecko) 4 (2.0) Chrome 5 Internet Explorer 9 Opera 12 Safari 5

Plus d'infos: https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Object/keys

Mais si vous n’avez besoin que du premier, nous pourrions organiser une solution plus courte comme:

var data = {"key1":"123","key2":"456"};
var first = {};
for(key in data){
    if(data.hasOwnProperty(key)){
        first.key = key;
        first.content =  data[key];
        break;
    }
}
console.log(first); // {key:"key",content:"123"}
3
Javier Cobos

Cela a été couvert ici avant.

Le concept de first ne s'applique pas aux propriétés d'objet, et l'ordre d'une boucle for ... in n'est pas garanti par les spécifications, mais en pratique, il est fiable FIFO sauf de manière critique pour chrome ( rapport d'erreur ). Prenez vos décisions en conséquence.

2
annakata

La première réponse pourrait générer l’ensemble du tableau, puis la capturer dans la liste. Voici un autre raccourci efficace

var obj = { first: 'someVal' };
Object.entries(obj)[0][1] // someVal
1
kishorekumaru
var obj = { first: 'someVal' };
let firstPropValue = Object.values(obj)[0];

Cela retournera toujours la valeur de la 1ère propriété, dans ce cas 'someVal'

1
Hamza Boularbah

Pour obtenir le premier nom de clé dans l'objet, vous pouvez utiliser:

var obj = { first: 'someVal' };
Object.keys(obj)[0]; //returns 'first'

Retourne une chaîne, de sorte que vous ne pouvez pas accéder aux objets imbriqués s'il y en avait, comme:

var obj = { first: { someVal : { id : 1} }; Ici, avec cette solution, vous ne pouvez pas accéder à id.

La meilleure solution si vous voulez obtenir l'objet réel est d'utiliser lodash comme ceci:

obj[_.first(_.keys(obj))].id

Pour retourner la valeur de la première clé (si vous ne connaissez pas exactement le nom de la première clé):

var obj = { first: 'someVal' };
obj[Object.keys(obj)[0]]; //returns 'someVal'

si vous connaissez le nom de la clé, utilisez simplement:

obj.first

ou

obj['first']
1
Diego Unanue

Si vous devez accéder à "la première propriété d'un objet", cela peut vouloir dire que votre logique a un problème. L'ordre des propriétés d'un objet ne devrait pas avoir d'importance.

0
Flavius Stef

Utilisez un tableau au lieu d'un objet (crochets).

var example = [ {/* stuff1 */}, { /* stuff2 */}, { /* stuff3 */}];
var fist = example[0];

Notez que vous perdez les identifiants 'foo'. Mais vous pouvez ajouter une propriété name aux objets contenus:

var example = [ 
  {name: 'foo1', /* stuff1 */},
  {name: 'foo2', /* stuff2 */},
  {name: 'foo3', /* stuff3 */}
];
var whatWasFirst = example[0].name;
0
steamer25

Une raison de ne pas faire ça?

> example.map(x => x.name);

(3) ["foo1", "foo2", "foo3"]
0
jtr13