自身可枚舉屬性

Object.keys() 方法會返回一個由一個給定對象的自身可枚舉屬性組成的數組，數組中屬性名的排列順序和使用 for...in 循環遍歷該對象時返回的順序一致 。如果對象的鍵-值都不可枚舉，那么將返回由鍵組成的數組。

這是合理的，因為大多數時候只需要關注對象自身的屬性。

來看看一個對象擁有自身和繼承屬性的例子，Object.keys()只返回自己的屬性鍵：

let simpleColors = { colorA: 'white', colorB: 'black'};let natureColors = { colorC: 'green', colorD: 'yellow'};Object.setPrototypeOf(natureColors, simpleColors);Object.keys(natureColors); // => ['colorC', 'colorD']natureColors['colorA']; // => 'white'natureColors['colorB']; // => 'black'

Object.setPrototypeOf() 方法設置一個指定的對象的原型 ( 即, 內部[[Prototype]]屬性）到另一個對象或 null。

Object.keys(natureColors)返回natureColors對象的自身可枚舉屬性鍵： ['colorC'，'colorD'] 。

natureColors包含從simpleColors原型對象繼承的屬性，但是Object.keys()函數會跳過它們。

Object.values() 和 Object.entries() 也都是返回一個給定對象自身可枚舉屬性的鍵值對數組

// ...Object.values(natureColors); // => ['green', 'yellow']Object.entries(natureColors);// => [ ['colorC', 'green'], ['colorD', 'yellow'] ]

現在注意與for..in語句的區別，for..in不僅可以循環枚舉自身屬性還可以枚舉原型鏈中的屬性

// ...let enumerableKeys = [];for (let key in natureColors) { enumerableKeys.push(key);}enumerableKeys; // => ['colorC', 'colorD', 'colorA', 'colorB']

enumerableKeys數組包含natureColors自身屬性鍵: 'colorC'和'colorD'。

另外for..in也遍歷了從simpleColors原型對象繼承的屬性

2. Object.values() 返回屬性值

Object.values()方法返回一個給定對象自身的所有可枚舉屬性值的數組，值的順序與使用for...in循環的順序相同 ( 區別在于 for-in 循環枚舉原型鏈中的屬性 )。

來個例子，使用Object.keys()收集keys，然后通過 key 去對象取對應的值：

let meals = { mealA: 'Breakfast', mealB: 'Lunch', mealC: 'Dinner'};for (let key of Object.keys(meals)) { let mealName = meals[key]; // ... do something with mealName console.log(mealName);}// 'Breakfast' 'Lunch' 'Dinner'

meal是一個普通對象。 使用Object.keys(meals)和枚舉的for..of循環獲取對象鍵值。

代碼看起來很簡單，但是，let mealName = meals[key] 沒有多大的必要，可以進一步優化，如下：

let meals = { mealA: 'Breakfast', mealB: 'Lunch', mealC: 'Dinner'};for (let mealName of Object.values(meals)) { console.log(mealName);}// 'Breakfast' 'Lunch' 'Dinner'