JavaScript에서는 setDate() 메서드를 사용하여 Date 객체의 일(day) 값을 손쉽게 변경할 수 있습니다. 이 메서드는 1~31 범위의 정수를 인자로 받으며, 지정한 값이 해당 월의 마지막 날짜를 초과하면 자동으로 다음 달로 넘어가 처리됩니다.
예제
다음은 JavaScript에서 날짜의 일(day)을 설정하는 전체 코드입니다 −
<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<style>
body {
font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}
.result,.sample {
font-size: 20px;
font-weight: 500;
}
</style>
</head>
<body>
<h1>Setting day of the date in JavaScript</h1>
<div class="sample"></div>
<div style="color: green;" class="result"></div>
<button class="Btn">CLICK HERE</button>
<h3>
Click on the above button to change the day of the above date object
</h3>
<script>
let sampleEle = document.querySelector('.sample');
let resEle = document.querySelector(".result");
let dateObj = new Date();
sampleEle.innerHTML = dateObj;
document.querySelector(".Btn").addEventListener("click", () => {
dateObj.setDate(28)
resEle.innerHTML = 'Changing day of the date = <br> '+dateObj;
});
</script>
</body>
</html>
출력
위 코드를 실행하면 다음과 같은 화면이 표시됩니다 −
'CLICK HERE' 버튼을 클릭하면 −
핵심 포인트 정리
dateObj.setDate(28)은 현재 월의 28일로 날짜를 변경합니다.- 인자로 해당 월의 일 수보다 큰 값(예: 32)을 전달하면 자동으로 다음 달로 롤오버됩니다.
setDate()는 원본 Date 객체를 직접 수정(mutate)하므로, 기존 날짜를 유지해야 한다면 미리new Date(dateObj)로 복사본을 만들어 두는 것이 안전합니다.- 요일이 아닌 '일(day)'을 설정하는 메서드라는 점에 유의하세요. 요일 자체는 날짜 값에 따라 자동으로 결정됩니다.