JS中的Object.keys怎么用?有什么作用?

Object.keys用于獲取對象自身可枚舉屬性名組成的數組。其基本用法是object.keys(obj),返回對象自身的可枚舉屬性數組,如遍歷對象屬性時可用object.keys(data).foreach處理每個鍵值對;判斷對象是否為空可通過object.keys(obj).Length === 0實現;還可提取對象鍵名用于進一步處理,如生成下拉菜單選項。但需注意:不可枚舉屬性、symbol屬性不會被列出,且非對象參數會拋出錯誤。

JS中的Object.keys怎么用?有什么作用?

Object.keys 是 JavaScript 中一個非常實用的方法,用來獲取對象自身的、可枚舉的屬性名,返回一個數組。它常用于遍歷對象屬性、判斷對象是否為空等場景。


基本用法

Object.keys(obj) 接收一個對象作為參數,返回該對象所有可枚舉屬性組成的數組。例如:

const user = {   name: 'Tom',   age: 25,   gender: 'male' };  console.log(Object.keys(user));  // 輸出 ["name", "age", "gender"]

注意:它只處理對象自身的屬性,不包括繼承來的屬性。


常見用途

1. 遍歷對象屬性

如果你需要對一個對象的所有鍵進行操作,比如打印每個鍵對應的值,可以這樣寫:

const data = { a: 1, b: 2, c: 3 };  Object.keys(data).foreach(key => {   console.log(`${key}: ${data[key]}`); });

這種方式比 for…in 更可控,尤其在你想排除原型鏈上的屬性時。

2. 判斷對象是否為空

有時候你需要判斷一個對象是不是“空”的,也就是有沒有自己的屬性:

function isEmpty(obj) {   return Object.keys(obj).length === 0; }  console.log(isEmpty({})); // true console.log(isEmpty({ key: 'value' })); // false

這個方法簡單直接,適合很多實際場景。

3. 獲取對象的鍵列表做進一步處理

比如你想把對象的鍵轉換成下拉菜單選項:

const options = {   red: '#FF0000',   green: '#00FF00',   blue: '#0000FF' };  const keys = Object.keys(options); // 可以傳給組件渲染下拉框,或者生成表單標簽等等

注意事項

  • 不可枚舉屬性不會被包含
    如果你用了 Object.defineProperty 設置某個屬性為不可枚舉,那它就不會出現在 Object.keys 的結果中。

  • Symbol 屬性不會被列出
    如果你用 Symbol 作為鍵名,也不會出現在結果里,需要用 Object.getOwnPropertySymbols() 來獲取。

  • 非對象參數會拋出錯誤(ES5 模式)
    嚴格模式下,傳入 NULL 或者原始類型(如數字、字符串)會報錯。建議使用前確保參數是對象。


總結一下

  • Object.keys 返回的是對象自身可枚舉屬性的數組。
  • 它在遍歷、判斷空對象、提取鍵名等場景非常有用。
  • 使用時要注意 Symbol 鍵和不可枚舉屬性的問題。

基本上就這些,不復雜但挺常用。

? 版權聲明
THE END
喜歡就支持一下吧
點贊8 分享