如何在 JavaScript 中將對象轉換為數組

要將對象轉換為 JavaScript 中的數組，可以使用以下三種方法之一：Object.keys() , Object.values() , 和 Object.entries() .

Object.keys() 方法是在 ES6 或 ECMAScript 2015 中引入的。後來在 ECMAScript 2017 (ES8) 中，兩個新方法 Object.entries() 和 Object.values() , 被添加以將對象轉換為數組。

假設您有以下 foods 對象：

const foods = {
    pizza: '🍕',
    burger: '🍔',
    fries: '🍟',
    cake: '🎂'
};

Object.keys() 方法

Object.keys() 方法返回給定對象自己的可枚舉屬性名稱的數組。屬性名稱的順序與手動迭代對象屬性時的順序相同。

這是一個轉換 foods 的屬性名稱的示例 對像到數組：

const keys = Object.keys(foods);

console.log(keys);
// [ 'pizza', 'burger', 'fries', 'cake' ]

Object.values() 方法

Object.values() 方法類似於 Object.keys() 除了它返回給定對象自己的可枚舉屬性值的數組：

const keys = Object.values(foods);

console.log(keys);
// [ '🍕', '🍔', '🍟', '🎂' ]

屬性值的順序與for..in循環提供的順序相同。

Object.entries() 方法

Object.entries() 方法將對象自己的可枚舉字符串鍵屬性對轉換為數組：

const keys = Object.entries(foods);

console.log(keys);
// [
//     ['pizza', '🍕'],
//     ['burger', '🍔'],
//     ['fries', '🍟'],
//     ['cake', '🎂']
// ]

屬性的鍵值對的順序類似於 for...in 循環提供的順序。

瀏覽器兼容性

Object.keys() 該方法適用於所有現代瀏覽器和 IE9 及更高版本。但是，Object.values() 和 Object.entries() 方法不受 Internet Explorer 支持，只能在現代瀏覽器中使用。

閱讀下一篇： 如何在 JavaScript 中將數組轉換為對象