在 JavaScript 中獲取物件的第一個鍵名

要取得 JavaScript 物件的第一個鍵，請讀取 Object.keys() 回傳陣列的第一個元素：Object.keys(obj)[0]。以 { foo: 'bar' } 這類物件為例，該運算式會得到 'foo'。如果也需要對應的值，Object.entries() 提供相關做法。本文會逐步說明這兩種方法、解釋哪個屬性才算是「第一個」，並展示物件沒有符合條件的屬性時該運算式會回傳什麼。

取得 JavaScript 物件的第一個鍵

JavaScript 物件以鍵值對儲存資料，但語言本身沒有專門詢問哪個鍵排在第一的函式。標準做法是建立物件自身屬性的陣列，再用索引存取。有兩個內建函式可以完成這項工作：

• Object.keys(obj) 會回傳只包含屬性名稱的陣列，因此 Object.keys(obj)[0] 是讀取第一個鍵最直接的方式。
• Object.entries(obj) 會回傳 [key, value] 配對組成的陣列，因此第一個鍵是 Object.entries(obj)[0][0]。

這兩者都是 Object 建構函式上的靜態函式，不是物件本身的實例方法，而且只能看到物件自身可列舉、以字串為鍵的屬性。

使用 Object.keys() 取得第一個鍵

Object.keys() 只接受一個引數，也就是物件本身，並依照物件的屬性順序，回傳其自身可列舉且以字串為鍵的屬性名稱所組成的陣列。該陣列的索引 0 就是第一個鍵。

執行這個範例：

本節中的程式碼以及顯示的標籤或輸出仍為英文。

const obj = {
  foo: 'bar',
  baz: 42,
  man: true
};

const keys = Object.keys(obj);
console.log(keys);
console.log(keys[0]);

[ 'foo', 'baz', 'man' ]
foo

此函式只回傳名稱。如果你還需要第一個鍵對應的值，可以用 obj[keys[0]] 查詢，或改用接下來示範的 Object.entries()。

使用 Object.entries() 取得第一個鍵

Object.entries() 同樣只接受物件作為唯一引數，但回傳陣列中的每個元素本身都是一個包含兩個元素的 [key, value] 陣列。這會多一個索引步驟：entries[0] 是第一組配對，entries[0][0] 是它的鍵。

本節中的程式碼以及顯示的標籤或輸出仍為英文。

const obj = {
  foo: 'bar',
  baz: 42,
  man: true
};

const entries = Object.entries(obj);
console.log(entries);
console.log(entries[0][0]);

[ [ 'foo', 'bar' ], [ 'baz', 42 ], [ 'man', true ] ]
foo

當值也很重要時，請選擇 Object.entries()，因為 entries[0][1] 會在同一個運算式中把值交給你。若只需要名稱，Object.keys() 能讓程式碼更簡短。兩個陣列遵循相同的屬性順序，所以這兩種方法對哪個鍵是第一個鍵的判斷永遠一致。

考量屬性順序與空物件

「第一個」不一定代表「最先寫入」。對於物件自身可列舉且以字串為鍵的屬性，JavaScript 會把屬性分成兩組排序：看起來像陣列索引的鍵，也就是 '2' 或 '10' 這類規範數字字串，會以遞增的數值順序排在所有其他字串鍵之前；其餘字串鍵則維持插入順序。

本節中的程式碼以及顯示的標籤或輸出仍為英文。

const scores = {
  b: 'bravo',
  '10': 'ten',
  a: 'alpha',
  '2': 'two'
};

console.log(Object.keys(scores));
console.log(Object.keys(scores)[0]);

[ '2', '10', 'b', 'a' ]
2

雖然 b 在原始碼中最先宣告，'2' 仍會排在最前面，因為類似整數索引的鍵會被歸在一般字串鍵之前。以 Symbol 為鍵的屬性絕不會出現在任一陣列中，繼承屬性或不可列舉的屬性也不會，例如使用 Object.defineProperty 並設定 enumerable: false 定義的屬性。

當物件沒有符合條件的屬性時，回傳的陣列長度為零，對它使用索引會得到 undefined，而不會拋出錯誤：

const obj = {};

console.log(Object.keys(obj));
console.log(Object.keys(obj)[0]);

[]
undefined

如果缺少鍵會影響你的程式碼，請在使用結果前檢查 keys.length 或先測試結果。

重點整理

• Object.keys(obj)[0] 回傳物件第一個自身可列舉、以字串為鍵的屬性鍵。
• Object.entries(obj)[0][0] 回傳相同的鍵，也可以透過 Object.entries(obj)[0][1] 存取第一個值。
• 哪個鍵排在第一位取決於 JavaScript 的屬性順序：類似整數索引的鍵會先依數值排序，再輪到其他字串鍵，所以它不一定是你最先寫入的屬性。
• 繼承、不可列舉以及以 Symbol 為鍵的屬性會完全略過；沒有符合條件之鍵的物件則會產生 undefined。