2016. 12. 28. 19:23ㆍHTML.CSS3.JavaScript.jQuery
[1] 객체
- var student = { name : "Tom",
korean : 95,
math : 90,
english : 95,
Sum : function () {
sum = this.korean + this.math + this.english ;
return sum;
}
};
- name, korean, math, english : key
- Tom, 95, 90, 95 : attribute (속성)
- Sum : method (메서드)
→ alert ( student.Sum() );
- 객체도 반복문을 사용할 수 있다.
for ( var key in student ) { alert ( key + ' : ' + student[key] ) ; }
- 객체에 속성과 메서드를 추가할 수 있다.
student.science = 90 ;
student.View = function () {
var view = '';
for ( key in student ) {
if ( key != "View" ) {
view += key + ' : ' + student[key] + '\n'
}
}
return view ;
}
→ alert ( student.View() );
- 생성자 함수 ★★
- new 키워드로 객체를 생성할 수 있는 함수
- function Student( name, korean, math, english ) {
this.name : "Tom"
this.korean : 95,
this.math : 90,
this.english : 95
}
- Student.prototype.getSum = function () {
return this.korean + this.math + this.english ;}
* prototype 은 모든 함수가 갖는 변수 또는 객체로써 prototype 에 함수를 저장해 놓으면 용량면에서 이득
* Student 생성자함수로 만들어진 객체는 prototype에 저장된 getSum 메서드를 가진다
객체or인스턴스
→ Student-1 = Student( "James", 100, 90, 90 )
→ Student-2 = Student( "John", 80, 85, 87 )
[2] 기본 내장 객체
① Object객체
- 모든 객체의 최상위 객체
- Object객체의 prototype 속성or메서드 는 모든 객체에서 사용가능
- Object.prototype.View = function () { ... };
→ ex) var example = 100
example.View();
② Number객체
→ var num = 0;
var num = Number ( 299 );
③ String객체
- String.length : 문자열 길이
→ var str = "" ;
var str = String ( "text" );
④ Array객체
→ var array = [ ] or New Array()
- Array() : 빈 배열 생성 [ ]
- Array(3) : 비어있는 배열3칸 생성 [ , , , ]
- Array(A,B,C,D) : [ A, B, C, D ]
- Array.length : 배열의 길이
- Array.slice( start , end ) : start 부터 end 까지의 요소만 return
- Array.pop() : 배열의 마지막 요소만 제거후 return
[3] Window객체
<script>
window.onload = function () {
window.X
}
</script>
X → screen, navigator, location, history, document
[3]-1 window객체의 속성
- window.innerHeight : Browser 안쪽 높이
- window.innerWidth : Browser 안쪽 너비
- window.outerHeight : Toolbar와 scollbar 를 포함 하는 높이
- window.outerWidth : Toolbar와 scrollbar 를 포함하는 너비
- window.setTimeout ( function (){} , ms ) : ms초 후에 함수 실행
- window.setInterval ( function (){} , ms ) : ms 마다 함수 실행
- window.cleartTimeout ( Id )
- window.clearInterval ( Id )
- window.scrollBy( x,y ) : 상대적 이동
- window.scrollTo( x,y ) : 절대적 이동
- window.location( yes or no ) : 주소 입력창 유무
- window.menubar( yes or no ) : 메뉴 유무
- window.toolbar( yes or no ) : 상태 표시줄 유무
- window.status( yes or no ) : 상태 표시줄 유무
- window.resizable( yes or no ) : 화면 크기 조절 가능 유무
[3]-2 screen객체의 속성
- window.screen.height : 화면의 높이
- window.screen.width : 화면의 너비
- window.screen.availHeight : 작업표시줄을 경계로 한 화면의 높이
- window.screen.availWidth : 작업표시줄을 경계로 한 화면의 너비
'HTML.CSS3.JavaScript.jQuery' 카테고리의 다른 글
[6] jQuery - Attribute(속성) , Method(메서드) (0) | 2016.12.29 |
---|---|
[5] JavaScript - DOM ( Document Object Model ) / Event (0) | 2016.12.28 |
[3] JavaScript - 기본개념 (0) | 2016.12.28 |
[2] CSS3 (0) | 2016.12.27 |
[1] HTML5 (0) | 2016.12.27 |