JavaScript로 날짜·시간을 12시간제 AM/PM 형식으로 표시하는 방법

JavaScript에서 현재 날짜와 시간을 12시간제(AM/PM) 형식으로 표시하려면 getHours()와 getMinutes() 메서드로 시와 분을 추출한 뒤, 시간 값이 12 이상이면 'PM', 그렇지 않으면 'AM'으로 판별하면 됩니다.

구현 로직

• getHours()로 24시간제 기준의 시(hour) 값을 가져옵니다.
• 시간이 12보다 크거나 같으면 'PM', 미만이면 'AM'을 지정합니다.
• % 12 연산으로 12시간제로 변환합니다. 단, 나머지가 0이 되는 자정(0시)과 정오(12시)는 12로 표시해야 합니다.
• 분이 10보다 작으면 앞에 '0'을 붙여 항상 두 자리로 맞춥니다.

예제 코드

function dateTOAMORPM(currentDateTime) {
    var hrs = currentDateTime.getHours();
    var mnts = currentDateTime.getMinutes();
    var AMPM = hrs >= 12 ? 'PM' : 'AM';
    hrs = hrs % 12;
    hrs = hrs ? hrs : 12;
    mnts = mnts < 10 ? '0' + mnts : mnts;
    var result = hrs + ':' + mnts + ' ' + AMPM;
    return result;
}
console.log(dateTOAMORPM(new Date()));

코드 설명

• hrs >= 12 ? 'PM' : 'AM' — 오후 여부를 판별해 AM 또는 PM을 결정합니다.
• hrs % 12 — 24시간제를 12시간제로 바꿉니다. 예를 들어 14시는 2가 됩니다.
• hrs ? hrs : 12 — 자정(0시)이나 정오(12시)는 나머지가 0이므로 이 경우 12로 표시합니다.
• mnts < 10 ? '0' + mnts : mnts — 분이 한 자리 수일 때 앞에 0을 붙입니다. 예: 5분 → 05분

실행 방법

Node.js 환경에서 위 프로그램을 실행하려면 아래 명령어를 사용합니다. 여기서는 파일 이름을 demo276.js로 저장했다고 가정합니다.

node demo276.js

실행 결과

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

PS C:\Users\Amit\javascript-code> node demo276.js
7:26 PM

참고: toLocaleTimeString() 활용하기

직접 변환 로직을 작성하지 않고 내장 메서드를 사용하면 더 간결하게 처리할 수 있습니다.

const now = new Date();
const time12h = now.toLocaleTimeString('en-US', {
  hour: 'numeric',
  minute: '2-digit',
  hour12: true
});
console.log(time12h); // 예: 7:26 PM

두 방법 모두 동일한 결과를 얻을 수 있으며, 상황에 따라 직접 구현한 함수가 필요한 형식을 더 유연하게 제어할 수 있다는 장점이 있습니다.