coyojo10의 개발블로그!
자바스크립트 내장 객체 본문
1. 자바스크립트에서 사용하는 객체
- 문서 객체 모델(DOM)
- 브라우저 객체 모델(BOM)
- 내장 객체 : 웹 프로그래밍시 자주 사용하는 요소를 미리 객체로 정의해 놓은 것, (날짜, 시간 가져올때 Date객체 사용)
2. 내장 객체 사용하기
- new 객체명( )
객체를 참조해서 사용해야 하므로 new 객체명() 과 같은 방식으로 객체를 인스턴스 형태로 만들어 사용한다.
즉, 자바스크립트 내장 객체는 그대로 두고 그 객체와 똑같은 속성과 기능을 만들 수 있다. 내장 객체가 틀이라면
그 틀을 이용해서 찍어내는 것이 인스턴스이다. ex) new Date()
var 변수명 = new 객체명()
객체 인스턴스를 만든 후 그것을 사용하기위해 변수를 선언하고 할당해준다!!
실습!
==> 날짜 , 시간 정보과 기능이 정의된 Date 객체를 불러오고 사용하기
<body>
<script type="text/javascript">
var today = new Date();
document.write(today+"<br/>");
document.write(today.toString()+"<br/>");
document.write(today.toLocaleString()+"<br/>");
// toLocaleString() 메서드는 시간을 우리에게 친숙한 형식으로 보여준다.
var str = today.getUTCFullYear() + "년 ";
str = str + today.getMonth() + "월 ";
// str + 를 꼭 해줘야 값이 계속 추가가 된다!
// + 안하면 str에 계속해서 새로운 값을 할당한다는 의미!
str = str + today.getDate() + "일 ";
str = str + today.getHours() + "시 ";
str = str + today.getMinutes() +"분 ";
str = str + today.getSeconds() +"초 ";
document.write("<h2>오늘 날짜 : " + str + "</br>")
요일 정보 가져오기!
var day = today.getDay();
// 이렇게만 하면 요일 정보가 숫자로만 나온다! 0-일요일 , ..... 6-토요일
<미션>
---- 미션 요일을 숫자가 아닌 "월요일" 이렇게 나타나도록 만들어주기!! ----
1)switch 문을 활용해서 만들기 !
<body>
var day = new Date();
var mission = day.getDay();
switch(mission) {
case 0 :
mission = "일요일"
break;
case 1 :
mission = "월요일"
break;
case 2 :
mission = "화요일"
break;
case 3 :
mission = "수요일"
break;
case 4 :
mission = "목요일"
break;
case 5 :
mission = "금요일"
break;
case 6 :
mission = "토요일"
break;
}
document.write(mission)
실습 2) 요일 정보 배열에 담아서 나타내기
배열 선언시 주의할 내용 - Array 객체를 쓸때와 안쓸때 초기값 주는 방법
1. Array 객체를 사용할때 : ( ) 에 값을 넣어준다.
var 변수명 = Array( "값1", "값2"," 값3",........)
2. Array 객체를 사용하지 않을때 - [ ]에 값을 넣어준다.
var 변수명 = [ "값1"," 값2", "값3", ........ ]
<body>
<script type="text/javascript">
var day2 = new Date();
var mission2 = day2.getDay();
var myarr = Array("일요일","월요일","화요일","수요일","목요일","금요일","토요일");
document.write(myarr[mission2]);'프론트엔드' 카테고리의 다른 글
| 프론트엔드 - css 적용 방법 3가지 (0) | 2023.01.18 |
|---|---|
| <input> 태그 속성 - type="hidden" (0) | 2022.12.12 |
| 자바스크립트 함수 실습 (0) | 2022.10.01 |
| 프론트엔드 - 자바스크립트 전역변수,지역변수 (0) | 2022.10.01 |
| <자바스크립트> 함수 (0) | 2022.10.01 |
'프론트엔드' Related Articles
more
