JavaScript對象轉換為數組

一、使用Object.keys()

Object.keys()方法會返回一個由給定對象的全部可枚舉屬性名組成的數組。

具體步驟：

const obj = { a: 1, b: 2, c: 3 };
const arr = Object.keys(obj);
console.log(arr); // ["a", "b", "c"]

說明：

我們通過Object.keys()方法將對象的屬性名轉換為數組。

需要注意的是，Object.keys()只能轉換對象的屬性名，不能轉換屬性值，如果要轉換屬性值，需要使用其他方法。

二、使用Object.values()

Object.values()方法會返回一個給定對象自身的所有可枚舉屬性值的數組。

具體步驟：

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

說明：

Object.values()方法可以將對象的屬性值轉換為數組，但是僅僅限於對象的自身屬性，不包括繼承的屬性。

三、使用Object.entries()

Object.entries()方法會返回一個給定對象自身可枚舉屬性的鍵值對數組。

具體步驟：

const obj = { a: 1, b: 2, c: 3 };
const arr = Object.entries(obj);
console.log(arr); // [["a", 1], ["b", 2], ["c", 3]]

說明：

Object.entries()方法將對象的屬性名和屬性值以鍵值對的形式存儲在數組中。

需要注意的是，這裡也只能轉換對象的自身屬性。

四、使用Array.from()

Array.from()方法會將一個類數組對象或可迭代對象轉換為真正的數組。

具體步驟：

const obj = { 0: "a", 1: "b", 2: "c", length: 3 };
const arr = Array.from(obj);
console.log(arr); // ["a", "b", "c"]

說明：

這種方式可以應用於類數組對象（例如函數的arguments對象），也可以應用於可迭代對象（例如Set和Map），將其轉換為真正的數組。

需要注意的是，只有可迭代對象才能被Array.from()方法轉換為數組，因為真正的數組可以被迭代。

五、使用擴展運算符

擴展運算符（…）能夠將一個可迭代對象轉換為一個數組。

具體步驟：

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

說明：

使用擴展運算符也能將一個可迭代對象（例如使用Object.values()方法轉換後的數組）轉換為真正的數組。

需要注意的是，擴展運算符和Array.from()方法類似，只能將可迭代對象（例如數組、Set、Map）轉換為真正的數組，不能將普通對象轉換為數組。