ES6+ Object.values()

1. 前言

上一節 我們學習了 Object.keys() 可以獲取對象上可枚舉屬性的 key 作為一個數組，對應的是不是有一個讓我們獲取對象上所有屬性值的方法呢？答案是肯定的，ES6 中提供了 Object.values() 獲取可枚舉對象上屬性的值作為一個數組。

2. 方法詳情

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

2.1 語法使用

Object.values(obj);

2.2 基本使用

var obj = {a: 1, b: 2, c: 3};
Object.values(obj)     // [1, 2, 3]

3. 實例

3.1 參數是數值或布爾值

上一節 我們知道 Object.keys() 的參數會被類型轉換為對象，數值對象沒有可遍歷的對象，所有返回一個空數組。同樣，Object.values() 和 Object.keys() 一樣都會進行類型轉換，所以傳入的是數字或布爾值時，則返回一個空數組

console.log(Object.values(123));	// []
Object.values(false)    // []

3.2 鍵排序問題

上一節 我們學習 Object.keys() 會對屬性是數值的鍵進行排序，在這個過程中屬性對應的值也會跟著改變位置，所有使用 Object.values() 返回的數組是按 Object.keys() 順序后的結果展示的，所以得到的值要和排序后的屬性一一對應。

var obj = {10: 'a', 1: 'b', 7: 'c'};
Object.values(obj)    // ['b', 'c', 'a']

3.3 參數為字符串

values() 傳入的對象如果是一個字符串時，則會把字符拆成數組中的單個項，如下：

Object.values('abc')    // ['a', 'b', 'c']

4. 小結

本節主要講解了 ES6 提供了獲取可枚舉對象上的屬性值的方法，這個方法可以很方便地獲取對象上的屬性值用于遍歷。提高代碼的簡潔性。這里需要注意的是在獲取屬性值時會對屬性為數值類型的鍵進行排序，所以對應的屬性值也會跟著一起被排序，所以得到的結果會有所不同。