Bagaimana cara mengakses properti pertama dari objek Javascript?

Apakah ada cara yang elegan untuk mengakses properti pertama dari suatu objek ...

1. di mana Anda tidak tahu nama properti Anda
2. tanpa menggunakan loop like for .. inatau jQuery$.each

Misalnya, saya perlu mengakses foo1objek tanpa mengetahui nama foo1:

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

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

Dengan ini, Anda juga dapat mengakses properti lain berdasarkan indeks. Sadarilah! Object.keyspesanan kembali tidak dijamin sesuai ECMAScript namun secara tidak resmi itu oleh semua implementasi browser utama, silakan baca https://stackoverflow.com/a/23202095 untuk rincian tentang ini.

Coba for … inloop dan istirahat setelah iterasi pertama:

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

Anda juga bisa melakukannya Object.values(example)[0].

Gunakan Object.keysuntuk mendapatkan array properti pada objek. Contoh:

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

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

Dokumentasi dan shim lintas-browser disediakan di sini . Contoh penggunaannya dapat ditemukan di salah satu jawaban saya di sini .

Sunting : untuk kejelasan, saya hanya ingin menggemakan apa yang dinyatakan dengan benar dalam jawaban lain: urutan kunci dalam objek javascript tidak ditentukan.

Versi satu aturan:

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

Tidak ada properti "pertama". Kunci objek tidak berurutan.

Jika Anda mengulanginya dengan untuk (var foo in bar)Anda akan mendapatkannya dalam beberapa urutan, tetapi mungkin berubah di masa depan (terutama jika Anda menambah atau menghapus kunci lain).

Solusi dengan perpustakaan lodash :

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

tetapi tidak ada jaminan dari urutan objek penyimpanan internal karena tergantung pada implementasi VM javascript.

Tidak. Objek literal, seperti yang didefinisikan oleh MDC adalah:

daftar nol atau lebih pasangan nama properti dan nilai terkait suatu objek, terlampir dalam kurung kurawal ({}).

Oleh karena itu objek literal bukan array, dan Anda hanya dapat mengakses properti menggunakan nama eksplisit atau forloop menggunakan inkata kunci.

Jawaban teratas dapat menghasilkan seluruh array dan kemudian menangkap dari daftar. Berikut ini jalan pintas lain yang efektif

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

Ini sudah dibahas di sini sebelumnya.

Konsep pertama tidak berlaku untuk properti objek, dan urutan for ... in loop tidak dijamin oleh spesifikasi, namun dalam praktiknya itu adalah FIFO andal kecuali kritis untuk chrome ( laporan bug ). Buat keputusan sesuai dengan itu.

Saya tidak menyarankan Anda untuk menggunakan Object.keys karena tidak didukung dalam versi IE lama. Tetapi jika Anda benar-benar membutuhkannya, Anda dapat menggunakan kode di atas untuk menjamin kompatibilitasnya:

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

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

Info lebih lanjut: https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Object/keys

Tetapi jika Anda hanya membutuhkan yang pertama, kami dapat mengatur solusi yang lebih pendek seperti:

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

Untuk mendapatkan nama kunci pertama dalam objek yang dapat Anda gunakan:

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

Mengembalikan string, jadi Anda tidak dapat mengakses objek bersarang jika ada, seperti:

var obj = { first: { someVal : { id : 1} }; Di sini dengan solusi itu Anda tidak dapat mengakses id.

Solusi terbaik jika Anda ingin mendapatkan objek yang sebenarnya adalah menggunakan lodash seperti:

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

Untuk mengembalikan nilai kunci pertama, (jika Anda tidak tahu persis nama kunci pertama):

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

jika Anda tahu nama kuncinya cukup gunakan:

obj.first

atau

obj['first']

Jika Anda perlu mengakses "properti pertama dari suatu objek", itu mungkin berarti ada sesuatu yang salah dengan logika Anda. Urutan properti objek seharusnya tidak menjadi masalah.

Gunakan array daripada objek (kurung siku).

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

Perhatikan bahwa Anda kehilangan pengidentifikasi 'foo'. Tapi Anda bisa menambahkan properti nama ke objek yang terkandung:

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

Ada alasan untuk tidak melakukan ini?

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

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

Anda dapat menggunakan Object.prototype.keysyang mengembalikan semua kunci suatu objek dalam urutan yang sama. Jadi jika Anda menginginkan objek pertama, dapatkan saja array itu dan gunakan elemen pertama sebagai kunci yang diinginkan.

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

kita juga bisa melakukan pendekatan ini.

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

Inilah cara yang lebih bersih untuk mendapatkan kunci pertama:

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]}`)