javascript Date 오브젝트 활용법

,

다음과 같이 사용한다.

var date = new Date(); 
//일단 이렇게 하면 date 객체에는 현재 날짜시각이 들어간다.
var 연도 = date.getFullYear();
//연도를 2009처럼 풀 연도로 구한다.
var 축약연도 = date.getYear();
//이렇게 하면 2009년은 109라고 나온다.
var 달_컴터용 = date.getMonth();
//이렇게 하면 1월부터 12월 사이가 0~11 숫자로 나온다.
var 달_인간용 = parseInt(date.getMonth())+1;
//그래서 인간용으로 하려면 아래처럼 해야 한다.
var 날 = date.getDate();

//20091026 형식으로 뽑으려면 아래처럼 한다.
var 오늘날짜 = 연도 + 달_인간용.toString() + 날

//달.toString을 한 이유는, 변수 '달_인간용'에 들어있는 자료형이 int기 때문이다. 자바 스크립트는 유연한 자료형을 사용하는데, 애초에 var a = "1" 이런 식으로 줘도 a+1을 을 연산하라고 하면 2를 반환한다. 그래서 숫자를 문자로 인식시키려면 a+''+1 이런 식으로 써줘서 중간에 문자형을 하나 넣어 주던가, 아니면 a.toString() 이런 식으로 문자형으로 명시를 해줘야 한다.

alert(오늘날짜);
//이러면 오늘날짜가 20091026 형식으로 alert창에 뜬다.

시간은 다음처럼 얻는다.

var 시=today.getHours();
var 분=today.getMinutes();
var 초=today.getSeconds();
// 한자리수일 경우 앞에 0을 추가하기 위해 아래처럼 처리한다.
분=checkTime(분);
초=checkTime(초);
alert('현재시각 _ '+시+':'+분+':'+초);

날짜 세팅 방법

다음, 다른 형태들을 알아보자.

꼭 오늘 날짜만 사용하는 경우만 있는 건 아닐 터, 다른 날짜로 세팅해서 사용하는 방법을 알아 보자. 이 부분은 W3C School의 JavaScript Date Object 부분을 참고했으며, 예문은 그대로 가져왔다.

2010년 1월 14일로 날짜를 세팅하려면 다음과 같이 해 준다.

var myDate=new Date();
myDate.setFullYear(2010,0,14);
//달을 쓸 때는 컴퓨터가 알아먹을 수 있게 해 줘야 한다. 1월은 0, 12월은 11 이런 식이다. 즉, 인간이 알아먹는 달에서 -1을 해 줘야 한다.

5일 뒤로 세팅을 해 보자.

var myDate=new Date();
myDate.setDate(myDate.getDate()+5);

연월을 자동으로 계산해서 올바른 날짜를 반환해 준다. 아주 좋다.

다양한 날짜 형태 반환

별로 유용하지는 않지만 Object를 곧장 사용하면 이렇게 된다.

document.write(Date());
//결과 : Mon Oct 26 2009 14:24:38 GMT+0900 (Japan Standard Time)

toUTCString() 메서드도 사용할 수 있는데, 결과를 보자.

var d=new Date();
document.write(d.toUTCString());
//결과 : Mon, 26 Oct 2009 05:24:19 GMT

게중 유용한 것은 유닉스 타임스탬프값 반환일 듯하다.

var d=new Date();
document.write("1970년 1월 1일 이후 "+d.getTime()+"초 지났다.");
//결과 : 1970년 1월 1일 이후 1256534643100초 지났다.

유닉스 타임스탬프는 1970년 1월 1일 이후 몇 초가 지났는지 찍어주는 것인데, 컴퓨터에서 날짜계산을 할 때 기본으로 사용하는 값이다. 예컨대, php는 원하는 날짜를 세팅할 때 유닉스 타임스탬프가 있으면 편하다.

응용 : 시계 달기

시계를 표시하는 함수는 다음과 같다.

<html>
<head>
<script type="text/javascript">
function startTime()
{
var today=new Date();
var h=today.getHours();
var m=today.getMinutes();
var s=today.getSeconds();
// 한자리수일 경우 앞에 0을 추가한다.
m=checkTime(m);
s=checkTime(s);
document.getElementById('txt').innerHTML=h+":"+m+":"+s;
t=setTimeout('startTime()',500);
}

function checkTime(i)
{
if (i<10)
  {
  i="0" + i;
  }
return i;
}
</script>
</head>

<body onload="startTime()">
<div id="txt"></div>
</body>
</html>

추가로, Date() 객체의 API를 참고하면 더 많은 정보를 얻을 수 있다.

👇 카테고리 글 목록

,

대표글

“javascript Date 오브젝트 활용법”에 대한 8개의 응답

  1. 잘보고갑니다^^

    1. 댓글 감사합니다. ^^ 이렇게 인사를 해 주시니 힘이 나는군요.

  2. 플러그인 적용하셨나보네요 +.+
    확실히 적용하면 이쁘게 보이긴하지만 관리하기가 여간여려운게 아니더라구요.

    ㅎㅎ
    그리고 티스토리나 텍스큐브의 경우에는 답글을 달아보려고 노력을 많이하는중이에요..^^

    1. 아 그렇군요. ^^ 댓글은 블로그의 재미 중 하나인 거 같아요. ㅋㅋ
      플러그인 적용 얘기는 아마 코드에 색깔 입히는 거 보고 말씀하신 거 같은데 맞나요? ㅋ 이거 텍스트큐브에 기본으로 제공되는 거예요.

      alert('기본 제공')

      이런 식으로 쓰면 알아서 뽑아 줘요. 물론 html모드에서 써야 하는 건 좀 귀찮긴 하죠. http://mytory.textcube.com/67 여기 설명해 놓은 게 있답니다.

  3. 질문입니다.
    1.이주소로들어가시면 제가몇가지질문을 한것이있습니다.안바쁘시다면 이주소로들어가셔서 질문을 보시고 방법을 알려주시면 감사하겟습니다.부탁드립니다.http://windowsforum.kr/3153383

    1. 위에 질문은 무시해주시구요 다시질문드리자면
      위에주소에서 보시면 1번째 질문만 해결하면됩니다.
      그리고 제가알려드린주소에 답변안하셔도 됩니다 그냥 이곳에다가 댓글달아주시면됩니다.
      1번만 어찌해결되면 좋을텐데..ㅠㅠ 좋은하루되십시요.

    2. 제가 모르는 쟁점입니다.

      1. 신경써주셔서 감사합니다

댓글 남기기