JavaScript에서 객체의 날짜(date) 속성을 기준으로 배열 정렬하기

JavaScript에서는 객체 배열에 담긴 날짜 데이터를 특정 기준에 따라 정렬해야 하는 경우가 자주 발생합니다. 이번 글에서는 각 객체가 date 속성을 가지고 있는 다음과 같은 배열을 날짜 순서대로 정렬하는 방법을 알아보겠습니다.

const arr = [
    {date: "2016-06-08 18:10:00"},
    {date: "2016-04-26 20:01:00"},
    {date: "2017-02-06 14:38:00"},
    {date: "2017-01-18 17:30:21"},
    {date: "2017-01-18 17:24:00"}
];

정렬 로직 설명

배열의 sort() 메서드를 활용하면 됩니다. 핵심은 비교 함수 안에서 문자열 형태의 날짜를 Date 객체로 변환한 뒤, 두 날짜를 서로 비교하는 것입니다.

• 첫 번째 날짜가 두 번째 날짜보다 빠르면 -1을 반환합니다.
• 첫 번째 날짜가 더 늦으면 1을 반환합니다.
• 두 날짜가 같으면 0을 반환합니다.

이렇게 하면 배열이 오름차순(오래된 날짜부터 최신 날짜 순)으로 정렬됩니다.

예제 코드

const arr = [
    {date: "2016-06-08 18:10:00"},
    {date: "2016-04-26 20:01:00"},
    {date: "2017-02-06 14:38:00"},
    {date: "2017-01-18 17:30:21"},
    {date: "2017-01-18 17:24:00"}
];

const sortByTime = (arr = []) => {
    arr.sort((a, b) => {
        const dateA = new Date(a.date);
        const dateB = new Date(b.date);
        return dateA < dateB ? -1 :
        (dateA > dateB ? 1 : 0);
    });
};

sortByTime(arr);
console.log(arr);

실행 결과

콘솔에 출력되는 결과는 다음과 같습니다. 날짜가 오래된 순서부터 최신 순서로 깔끔하게 정렬된 것을 확인할 수 있습니다.

[
    { date: '2016-04-26 20:01:00' },
    { date: '2016-06-08 18:10:00' },
    { date: '2017-01-18 17:24:00' },
    { date: '2017-01-18 17:30:21' },
    { date: '2017-02-06 14:38:00' }
]

참고 사항

내림차순(최신 날짜가 먼저 오도록) 정렬하고 싶다면 비교 결과의 부호를 반대로 바꾸면 됩니다. 즉, return dateA > dateB ? -1 : (dateA < dateB ? 1 : 0);처럼 작성하거나, 정렬 후 reverse()를 호출하면 됩니다. 또한 날짜 문자열이 ISO 8601 형식(예: YYYY-MM-DD HH:mm:ss)이라면 Date 객체로의 변환이 안정적으로 동작하므로, 가능한 한 표준 형식을 유지하는 것이 좋습니다.