¿Cómo acceder a la primera propiedad de un objeto Javascript?

¿Existe una manera elegante de acceder a la primera propiedad de un objeto ...

1. donde no sabes el nombre de tus propiedades
2. sin usar un bucle como for .. ino jQuery$.each

Por ejemplo, necesito acceder al foo1objeto sin saber el nombre de foo1:

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

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

Con esto, también puede acceder a otras propiedades por índices. ¡Ten cuidado! Object.keysel pedido de devolución no está garantizado según ECMAScript; sin embargo, de manera extraoficial se encuentra en todas las implementaciones de navegadores principales, lea https://stackoverflow.com/a/23202095 para obtener más información al respecto.

Pruebe el for … inciclo y rompa después de la primera iteración:

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

También puedes hacer Object.values(example)[0].

Se usa Object.keyspara obtener una matriz de las propiedades de un objeto. Ejemplo:

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

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

Documentación y shim entre navegadores provistos aquí . Un ejemplo de su uso se puede encontrar en otra de mis respuestas aquí .

Editar : para mayor claridad, solo quiero hacer eco de lo que se dijo correctamente en otras respuestas: el orden de las claves en los objetos de JavaScript no está definido.

Una versión de una regla:

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

No hay una "primera" propiedad. Las claves de objeto no están ordenadas.

Si los repite (var foo in bar), los obtendrá en algún orden, pero puede cambiar en el futuro (especialmente si agrega o elimina otras claves).

Solución con la biblioteca lodash :

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

pero no hay garantía del orden de almacenamiento interno de las propiedades del objeto porque depende de la implementación de la máquina virtual javascript.

No. Un objeto literal, como lo define MDC es:

una lista de cero o más pares de nombres de propiedades y valores asociados de un objeto, encerrados entre llaves ({}).

Por lo tanto, un objeto literal no es una matriz, y solo puede acceder a las propiedades con su nombre explícito o un forbucle con la inpalabra clave.

La respuesta principal podría generar toda la matriz y luego capturarla de la lista. Aquí hay otro atajo efectivo

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

Esto ha sido cubierto aquí antes.

El concepto de primero no se aplica a las propiedades de los objetos, y el orden de un bucle for ... in no está garantizado por las especificaciones, sin embargo, en la práctica, es confiable FIFO excepto críticamente para Chrome ( informe de error ). Tome sus decisiones en consecuencia.

No le recomiendo que use Object.keys ya que no es compatible con versiones antiguas de IE. Pero si realmente lo necesita, puede usar el código anterior para garantizar la compatibilidad con la parte posterior:

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

Característica Firefox (Gecko) 4 (2.0) Chrome 5 Internet Explorer 9 Opera 12 Safari 5

Más información: https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Object/keys

Pero si solo necesita el primero, podríamos organizar una solución más corta como:

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

Para obtener el primer nombre clave en el objeto, puede usar:

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

Devuelve una cadena, por lo que no puede acceder a objetos anidados si hubiera, como:

var obj = { first: { someVal : { id : 1} }; Aquí con esa solución no puede acceder a la identificación.

La mejor solución si desea obtener el objeto real es usar lodash como:

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

Para devolver el valor de la primera clave (si no sabe exactamente el nombre de la primera clave):

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

si conoce el nombre de la clave, simplemente use:

obj.first

o

obj['first']

Si necesita acceder a "la primera propiedad de un objeto", puede significar que hay algo mal con su lógica. El orden de las propiedades de un objeto no debería importar.

Use una matriz en lugar de un objeto (corchetes).

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

Tenga en cuenta que pierde los identificadores 'foo'. Pero podría agregar una propiedad de nombre a los objetos contenidos:

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

¿Alguna razón para no hacer esto?

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

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

Puede usar Object.prototype.keyscual devuelve todas las claves de un objeto en el mismo orden. Entonces, si desea el primer objeto, simplemente obtenga esa matriz y use el primer elemento como clave deseada.

const o = { "key1": "value1", "key2": "value2"};
const idx = 0; // add the index for which you want value
var key = Object.keys(o)[idx];
value = o[key]
console.log(key,value); // key2 value2

También podemos hacer con este enfoque.

var example = {
  foo1: { /* stuff1 */},
  foo2: { /* stuff2 */},
  foo3: { /* stuff3 */}
}; 
Object.entries(example)[0][1];

Aquí hay una forma más limpia de obtener la primera clave:

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

var object2 = {
    needThis: 'This is a value of the property',
    foo2: { /* stuff2 */},
    foo3: { /* stuff3 */}
};

let [first] = Object.keys(example)
let [firstProp] = Object.keys(object2)

console.log(first)
//Prop : needThis, Value: This is a value of the property
console.log(`Prop : ${firstProp}, Value: ${object2[firstProp]}`)