JavaScript에서 날짜 패턴의 유효성을 검사하려면 아래 코드를 실행해 보세요. 이 예제에서는 올바른 날짜와 잘못된 날짜를 모두 테스트하여 유효성 검사가 제대로 작동하는지 확인합니다.
동작 원리
validDate 함수는 먼저 입력받은 날짜 문자열을 슬래시(/) 기준으로 분리합니다. 이후 new Date() 객체를 생성하고, 해당 객체의 월(getMonth), 일(getDate), 연도(getFullYear) 값이 원본 문자열과 정확히 일치하는지 비교합니다.
JavaScript의 Date 객체는 존재하지 않는 날짜(예: 18월 18일)가 입력되면 자동으로 다음 달로 넘겨 계산하기 때문에, 단순히 Date 객체만으로는 유효성을 판별할 수 없습니다. 따라서 각 값이 원본과 일치하는지 직접 비교함으로써 잘못된 날짜를 걸러낼 수 있습니다.
예제
<!DOCTYPE html>
<html>
<body>
<script>
function validDate(date) {
var split = date.split('/');
var date = new Date(split[2] + '/' + split[0] + '/' + split[1]);
return (date && (date.getMonth() + 1) == split[0] && date.getDate() == Number(split[1]) && date.getFullYear() == Number(split[2]));
}
document.write("Valid date: 11/11/2017 = "+validDate('11/11/2017'));
document.write("<br>Valid date: 18/18/2017 = "+validDate('18/18/2017'));
document.write("<br>Valid date: 05/09/2017 = "+validDate('05/09/2017'));
</script>
</body>
</html>
출력 결과
Valid date: 11/11/2017 = true
Valid date: 18/18/2017 = false
Valid date: 05/09/2017 = true