JavaScript로 MM-YYYY 형식 날짜 배열 정렬하기

문제 상황

다음과 같이 MM-YYYY 형식의 날짜 문자열을 담고 있는 배열이 있다고 가정해 보겠습니다.

const arr = ["1-2016", "7-2015", "7-2016", "3-2016", "8-2016", "2-2016", "6-2016", "8-2015", "5-2016", "4-2016", "9-2015", "10-2015", "11-2015", "12-2015"];

이 배열을 입력받아 가장 오래된 날짜부터 최신 날짜 순서(오름차순)로 정렬하는 JavaScript 함수를 작성해야 합니다.

정렬 원리

날짜 문자열을 그대로 비교하면 문제가 발생합니다. 예를 들어 "10-2015"와 "9-2015"를 사전순으로 비교하면 "10-2015"가 더 앞에 온다는 잘못된 결과가 나옵니다.

따라서 각 날짜를 연도 4자리 + 월 2자리 형태의 값(예: 201507)으로 변환한 뒤 크기를 비교하는 것이 핵심입니다. 여기서 padToString 함수는 한 자리 월 앞에 0을 채워 두 자리로 맞춰 주는 역할을 합니다.

예제 코드

이를 구현한 코드는 다음과 같습니다.

const arr = ["1-2016", "7-2015", "7-2016", "3-2016", "8-2016", "2-2016", "6-2016", "8-2015", "5-2016", "4-2016", "9-2015", "10-2015", "11-2015", "12-2015"];
const padToString = (num) => {
    return String("0" + num).slice(-2);
};
const sortByDate = (first, second) => {
    const firstPart = first.split('-'), secondPart = second.split('-');
    const a = firstPart[1] + padToString(firstPart[0]);
    const b = secondPart[1] + padToString(secondPart[0]);
    return a - b;
};
arr.sort(sortByDate);
console.log(arr);

코드의 동작 흐름을 살펴보면 다음과 같습니다.

1. split('-')으로 각 날짜 문자열을 월과 연도로 분리합니다.
2. 연도 뒤에 두 자리로 맞춘 월을 이어 붙여 비교용 키를 만듭니다.
3. 두 키의 차이를 반환하여 Array.prototype.sort()가 오름차순으로 정렬하도록 합니다.

참고로 Array.prototype.sort()는 비교 함수가 반환하는 값이 음수면 첫 번째 요소를 앞으로, 양수면 뒤로 배치하는 방식으로 동작하며, 원본 배열 자체를 변경한다는 점도 기억해 두면 좋습니다.

실행 결과

콘솔에 출력되는 결과는 다음과 같습니다.

[
    '7-2015', '8-2015',
    '9-2015', '10-2015',
    '11-2015', '12-2015',
    '1-2016', '2-2016',
    '3-2016', '4-2016',
    '5-2016', '6-2016',
    '7-2016', '8-2016'
]

결과를 보면 2015년 7월부터 2016년 8월까지 시간 순서대로 올바르게 정렬된 것을 확인할 수 있습니다.