Computer >> 컴퓨터 >  >> 프로그래밍 >> JavaScript

JavaScript Date.setDate() 함수 완벽 정리 – 문법과 예제 총정리

Date 객체는 JavaScript 언어에 내장된 데이터 타입으로, 날짜와 시간 정보를 다룰 때 사용됩니다. Date 객체는 아래와 같이 new Date() 생성자를 통해 생성할 수 있습니다.

Date 객체가 한 번 생성되면 다양한 내장 메서드를 이용해 객체를 조작할 수 있습니다. 대부분의 메서드는 현지 시간(local time) 또는 UTC(협정 세계시, GMT)를 기준으로 객체의 연도, 월, 일, 시, 분, 초, 밀리초 필드를 가져오거나 설정하는 역할을 합니다.

그중 setDate() 함수는 해당 월의 일(day of month)을 나타내는 정수를 인수로 받아, 현재 설정된 날짜의 '일' 값을 수정하거나 새로 지정하는 기능을 합니다.

문법(Syntax)

setDate() 함수의 기본 문법은 다음과 같습니다.

dateObj.setDate(5);

예제 1: 기존 날짜의 일 변경하기

다음 예제는 1989년 9월 26일로 생성된 날짜 객체의 일자를 setDate(1)을 사용해 1일로 변경하는 코드입니다.

<html>
<head>
   <title>JavaScript Example</title>
</head>
<body>
   <script type="text/javascript">
      var dateObj = new Date('september 26, 89 12:4:25:96');
      document.write("Current date: "+dateObj.toUTCString());
      document.write("<br>");
      dateObj.setDate(1);
      document.write("Date after modification: "+dateObj.toUTCString());
   </script>
</body>
</html>

실행 결과

Current date: Tue, 26 Sep 1989 06:34:25 GMT
Date after modification: Fri, 01 Sep 1989 06:34:25 GMTMT

실행 결과를 보면 연도와 월, 시간은 그대로 유지된 채 일자만 26일에서 1일로 변경된 것을 확인할 수 있습니다.

예제 2: 일자 없이 생성한 날짜 객체에 일 설정하기

날짜 객체를 생성할 때 일(day)을 지정하지 않았더라도, 이후에 setDate() 함수를 사용해 일자를 따로 설정할 수 있습니다.

<html>
<head>
   <title>JavaScript Example</title>
</head>
<body>
   <script type="text/javascript">
      var dateObj = new Date('August, 1989 00:4:00');
      document.write("<br>");
      dateObj.setDate(5)
      document.write(dateObj.toDateString());
   </script>
</body>
</html>

실행 결과

Sat Aug 05 1989

예제 3: 생성자에 값 없이 생성 후 일 설정하기

마찬가지로 생성자에 아무 값도 전달하지 않고 날짜 객체를 생성한 경우에도 이 함수로 일자를 설정할 수 있습니다. 이때 월과 연도 값은 현재 날짜 기준으로 그대로 유지됩니다.

<html>
<head>
   <title>JavaScript Example</title>
</head>
<body>
   <script type="text/javascript">
      var dateObj = new Date();
      dateObj.setDate(2);
      document.write(dateObj.toDateString());
   </script>
</body>
</html>

실행 결과

Tue Oct 02 2018

예제 4: 0을 입력하면 지난달의 마지막 날이 됩니다

이 함수를 사용해 일자를 0으로 설정하면, 날짜는 이전 달의 마지막 날로 자동 지정됩니다.

<html>
<head>
   <title>JavaScript Example</title>
</head>
<body>
   <script type="text/javascript">
      var dateObj = new Date('23, August, 1989 00:4:00');
      document.write("<br>");
      dateObj.setDate(0);
      document.write(dateObj.toDateString());
   </script>
</body>
</html>

실행 결과

Mon Jul 31 1989

1989년 8월 23일로 생성된 날짜에 setDate(0)을 적용하자 7월의 마지막 날인 7월 31일로 변경된 것을 볼 수 있습니다.

정리 및 참고 사항

  • setDate()는 월중 일을 나타내는 정수(일반적으로 1~31)를 인수로 받습니다.
  • 0을 입력하면 이전 달의 마지막 날이 되며, 음수나 31을 초과하는 값도 상대적으로 계산되어 월(및 연도)이 자동으로 조정됩니다.
  • 일 변경으로 인해 월의 경계를 넘게 되면 월과 연도 값도 함께 자동 갱신됩니다.
  • 이 함수는 수정된 날짜를 밀리초 단위의 타임스탬프(number) 값으로 반환합니다.