JavaScript 객체의 모든 값을 배열로 변환하는 2가지 방법

JavaScript 개발을 하다 보면 객체(Object)에 담긴 모든 프로퍼티 값을 하나의 배열로 변환해야 하는 경우가 자주 발생합니다. 예를 들어 다음과 같은 객체가 있다고 가정해 보겠습니다.

{
    "firstName": "John",
    "lastName": "Smith",
    "isAlive": "true",
    "age": "25"
}

이 객체로부터 아래와 같이 값들만 순서대로 담긴 배열을 만들어야 합니다.

const myarray = ['John', 'Smith', 'true', '25'];

방법 1: Object.keys()와 반복문 활용

Object.keys() 메서드로 객체의 키(key) 목록을 먼저 가져온 뒤, 반복문을 돌면서 각 키에 해당하는 값을 새로운 배열에 하나씩 추가하는 방식입니다.

const obj = {
    "firstName": "John",
    "lastName": "Smith",
    "isAlive": "true",
    "age": "25"
};
const objectToArray = obj => {
    const keys = Object.keys(obj);
    const res = [];
    for(let i = 0; i < keys.length; i++){
        res.push(obj[keys[i]]);
    };
    return res;
};
console.log(objectToArray(obj));

출력 결과

콘솔에 다음과 같이 출력됩니다.

[ 'John', 'Smith', 'true', '25' ]

방법 2: Object.values()로 한 줄 처리

ES2017(ES8)부터 도입된 Object.values() 메서드를 사용하면 위 과정을 단 한 줄로 해결할 수 있습니다. 이 메서드는 객체가 가진 열거 가능한(enumerable) 프로퍼티 값들을 배열 형태로 그대로 반환하기 때문에, 별도의 반복문 없이 간결하게 작성할 수 있습니다.

const obj = {
    "firstName": "John",
    "lastName": "Smith",
    "isAlive": "true",
    "age": "25"
};
const res = Object.values(obj);
console.log(res);

출력 결과

콘솔에 다음과 같이 출력됩니다.

[ 'John', 'Smith', 'true', '25' ]

어떤 방법을 선택해야 할까?

두 방법 모두 동일한 결과를 반환하지만, 실무에서는 코드가 간결하고 가독성이 좋은 Object.values() 사용을 권장합니다. 반복문을 직접 작성하는 첫 번째 방법은 변환 과정에 추가 로직(필터링, 데이터 가공 등)이 필요할 때 유용하게 활용할 수 있습니다. 참고로 키와 값을 함께 다뤄야 한다면 Object.entries() 메서드도 함께 알아두면 좋습니다.