09009
[JavaScript] 날짜 변환 함수 정리 본문
/* 년.월.일 시간으로 변환 */
const formatDate = (dateString) => {
const date = new Date(dateString);
const year = date.getFullYear();
const month = String(date.getMonth() + 1).padStart(2, '0');
const day = String(date.getDate()).padStart(2, '0');
const hour = String(date.getHours() % 12 || 12).padStart(2, '0'); // 12시간 형식으로 변환하고 0시는 12시로 처리합니다.
const minute = String(date.getMinutes()).padStart(2, '0');
const ampm = date.getHours() < 12 ? '오전' : '오후';
const formattedDate = `${year}-${month}-${day} ${ampm} ${hour}:${minute}`;
return formattedDate;
}
/* 년.월.일로 변환 */
const formatDateYmd = (dateString) => {
const date = new Date(dateString);
const year = date.getFullYear();
const month = String(date.getMonth() + 1).padStart(2, '0');
const day = String(date.getDate()).padStart(2, '0');
const hour = String(date.getHours() % 12 || 12).padStart(2, '0'); // 12시간 형식으로 변환하고 0시는 12시로 처리합니다.
const minute = String(date.getMinutes()).padStart(2, '0');
const ampm = date.getHours() < 12 ? '오전' : '오후';
const formattedDate = `${year}.${month}.${day}`;
return formattedDate;
}
/* 년.월.일 시간으로 변환 */
const formatAmPmDate = (dateString) => {
const date = new Date(dateString);
const year = date.getFullYear();
const month = String(date.getMonth() + 1).padStart(2, '0');
const day = String(date.getDate()).padStart(2, '0');
const hour = String(date.getHours() % 12 || 12); // 12시간 형식으로 변환하고 0시는 12시로 처리합니다.
const minute = String(date.getMinutes()).padStart(2, '0');
const ampm = date.getHours() < 12 ? '오전' : '오후';
const formattedDate = `${ampm} ${hour}:${minute}`;
return formattedDate;
}
/* 분 단위로 변환하는 함수 */
const formatDateTime = (dateString) => {
const date = new Date(dateString);
const now = new Date();
const timeDiff = now.getTime() - date.getTime(); // 현재 시간과 작성일과의 차이 (밀리초 단위)
const minutesDiff = Math.floor(timeDiff / (1000 * 60)); // 분 단위로 변환
// 1시간 이내일 경우
if (minutesDiff < 60) {
// 1분 미만일 경우
if (minutesDiff < 1) {
return '방금 전';
}
// 1분 이상일 경우
else {
return minutesDiff + '분 전';
}
}
// 24시간 이내일 경우
else if (minutesDiff < 1440) {
const hoursDiff = Math.floor(minutesDiff / 60);
return hoursDiff + '시간 전';
}
// 30일 이내일 경우
else if (minutesDiff < 30 * 24 * 60) {
const daysDiff = Math.floor(minutesDiff / (24 * 60));
return daysDiff + '일 전';
}
// 12개월 이내일 경우
else if (minutesDiff < 12 * 30 * 24 * 60) {
const monthsDiff = Math.floor(minutesDiff / (30 * 24 * 60));
return monthsDiff + '달 전';
}
const year = date.getFullYear();
const month = date.getMonth() + 1;
const day = date.getDate();
let hours = date.getHours();
const minutes = date.getMinutes();
let period = '오전';
if (hours >= 12) {
period = '오후';
if (hours > 12) {
hours -= 12;
}
} else if (hours === 0) {
hours = 12;
}
const formattedDateTime = year + '-' + ('0' + month).slice(-2) + '-' + ('0' + day).slice(-2) + ' ' + period + ' ' + ('0' + hours).slice(-2) + ':' + ('0' + minutes).slice(-2);
return formattedDateTime;
}
/* 어제인지의 여부 확인 */
const isYesterday = (date, now) => {
const yesterday = new Date(now);
yesterday.setDate(now.getDate() - 1);
return date.getFullYear() == yesterday.getFullYear() &&
date.getMonth() == yesterday.getMonth() &&
date.getDate() == yesterday.getDate();
}
/* 일 단위로 변환하는 함수 (메시지 전용) */
const formatChatTime = (dateString) => {
const date = new Date(dateString);
const now = new Date();
const daysDiff = Math.floor((now - date) / (1000 * 60 * 60 * 24));
if (daysDiff == 0 && !isYesterday(date, now)) {
return formatHourAndMinute(date);
} else {
return formatMonthAndDate(date);
}
}
/* 오전, 오후 구분 함수 */
const formatHourAndMinute = (date) => {
let hour = date.getHours();
const minute = date.getMinutes();
const period = (hour < 12) ? "오전" : "오후";
// 0시일 경우, 12로 변경
if (hour == 0) {
hour = 12;
}
// 오후인 경우 12를 빼서 12시간 형식으로 변경
else if (hour > 12) {
hour -= 12;
}
return `${period} ${hour}:${minute.toString().padStart(2, '0')}`;
}
/* 년,월,일 변환 함수 */
const formatMonthAndDate = (date) => {
const year = date.getFullYear();
const month = date.getMonth() + 1;
const day = date.getDate();
const now = new Date();
const nowYear = now.getFullYear();
// 현재 연도와 비교
if (year == nowYear) {
return `${month}월 ${day}일`;
} else {
return `${year}년 ${month}월 ${day}일`;
}
}
'Front-End > Javascript' 카테고리의 다른 글
[JavaScript] 클래스 (0) | 2024.05.08 |
---|---|
[JavaScript] 변수, 스코프, 생성자 함수 (0) | 2024.05.08 |
[JS] DOM 조작 기초 (0) | 2023.05.24 |
[Javascript] 프레임 애니메이션 (0) | 2023.04.04 |
[Javascript] 입력 양식 포커스 - 회원가입 양식 (0) | 2023.04.04 |
Comments