[javascript] 특정 날짜, 시간에만 실행하기

Date 객체 생성

먼저 오늘날짜를 얻기 위해 Date 객체를 호출합니다.

var today = new Date();

 

생성된 Date객체를 console.log로 출력해 보면 현재 날짜와 시간이 출력됩니다. (GMT - Greenwich Mean Time)

Date 객체를 출력하면 객체의 toString() 메서드가 자동으로 호출됩니다.

var today = new Date();
console.log (today);

 

 

Date 날짜 구하기

생성된 Date 객체의 메서드를 사용해서 년, 월, 일을 가져와볼게요.

 

getFullTear() : 년도(4자리)

getMonth() : 월(0 ~ 11 / 1월 ~ 12월)

getDate() : 일(1 ~ 31)

 

위의 메서드를 사용하여 호출해 줍니다.

toString() 메서드로 숫자열을 문자열로 바꿔줬어요!  

var yyyy = today.getFullYear().toString();
var mm = today.getMonth().toString();
var dd = today.getDate().toString();

 

이렇게 년, 월, 일을 호출해 주고 console.log로 출력을 해보면

var yyyy = today.getFullYear().toString();
var mm = today.getMonth().toString();
var dd = today.getDate().toString();

console.log(yyyy);
console.log(mm);
console.log(dd);

 

아래처럼 콘솔로그에 날짜가 찍혀 나옵니다.

 

이때 3월이지만 숫자 2로 나오는 이유는!!

자바스크립트에서 getMonth() 메서드는 0~11까지의 값을 반환하기 때문에

1월이면 0을 2월이면 1을 반환하여 3월이지만 2로 나오는 거랍니다!

따라서 getMonth() 메서드를 "3월"로 숫자를 뽑아 사용할 때는 date.getMonth()  + 1을 해줘야 합니다.

 

하지만 저는 숫자를 뽑을 필요는 없고 해당 날짜와 시간에만 실행되게 해 줄 거기 때문에

다음 작업을 해볼게요!

 

Date 특정 시간 구하기

이때는 if문을 사용해야 하는데

그전에 제가 실행할 특정 날짜의 시작하는 날과 끝나는 날을 먼저 호출해 볼게요.

var startDate = new Date(yyyy,mm,dd,09,0,0);
var endDate = new Date(yyyy,mm,dd,18,0,0);

 

 

저는 9시부터 18시까지만 실행하려고 해요!

var startDate = new Date(yyyy,mm,dd,09,0,0);
var endDate = new Date(yyyy,mm,dd,18,0,0);

console.log (startDate);
console.log (endDate);

 

consloe.log로 확인해 보면 이렇게 10시부터 18시로 찍히는 걸 확인할 수 있어요! 

 

var today = new Date();
var yyyy = today.getFullYear().toString();
var mm = today.getMonth().toString();
var dd = today.getDate().toString();
var startDate = new Date(yyyy,mm,dd,09,0,0);
var endDate = new Date(yyyy,mm,dd,18,0,0);

console.log(today);
console.log(yyyy);
console.log(mm);
console.log(dd);
console.log (startDate);
console.log (endDate);

 

 

Date 특정 시간 조건문 추가하고 실행하기

제가 호출할 건 popup()이고 이 부분을 변경해서 원하는 영역을 호출해 주시면 됩니다.

현재 날짜가 시작일보다 이 후면서 끝나는 날의 이전일 때 실행되도록 조건을 걸어주고

if문 조건에 해당되면 보이도록 작업했어요.

function popup() {
  $('.popup-warp').show();
}

var today = new Date();
var yyyy = dt.getFullYear().toString();
var mm = dt.getMonth().toString();
var dd = dt.getDate().toString();
var startDate = new Date(yyyy,mm,dd,09,0,0);
var endDate = new Date(yyyy,mm,dd,18,0,0);

if (today <= endDate && today >= startDate) {
    popup();
    
    console.log(today);
    console.log(yyyy);
    console.log(mm);
    console.log(dd);
    console.log (startDate);
    console.log (endDate);
}

 

Date 특정 날짜 조건문 추가하고 실행하기

여기까지 하면 해당 시간에 잘 실행이 되더라고요!

근데 저는 특정 날짜의 특정시간에만 실행을 하길 원해서

또 조건을 추가해줘야 했어요ㅠㅠ

 

10일, 20일, 30일에만 실행해주려고 해요!

 

저는 디블리셔라 자바스크립트를 잘 안 써서 어렵더라고요ㅠㅠ 그래서 이 타이밍에 개발자남자 친구의 찬스를 써봤습니다.!

그러더니   if('10|20|30'.indexOf(dd) > -1)  이걸 쓰면 조건에 만족한다고 하더라고요!

날짜가 -1보다 크면서 10일, 20일, 30일 때를 말하는 거 같아요.(나만의 해석)

 

그래서 저 조건문을 넣어보면!

function popup() {
  $('.popup-warp').show();
}

var today = new Date();
var yyyy = dt.getFullYear().toString();
var mm = dt.getMonth().toString();
var dd = dt.getDate().toString();
var startDate = new Date(yyyy,mm,dd,09,0,0);
var endDate = new Date(yyyy,mm,dd,18,0,0);

if (today <= endDate && today >= startDate) {
    if('10|20|30'.indexOf(dd) > -1){
      popup();
    }
}

 

 

이렇게 조건문을 넣어주면 원하는 특정 날짜와 특정시간에만 실행이 가능하답니다!!

도움이 되었길 바래요!