Window 객체

Window 객체란 브라우저의 요소, 자바스크립트 엔진, 모든 변수를 담고 있는 객체이다.

 

브라우저를 보면, 뒤로가기, 즐겨찾기, 탭, 주소창 등이 브라우저, 

그 안에 웹사이트가 표시되게 된다. 이 브라우저 전체를 담당하는 것이 window 객체이고, 

웹사이트를 담당하는 것이 Document 객체 인 것이다.

 

 

window 객체 아래에는 대표적으로, screen , location , history, document 같은 객체들이 있다.

 

메소드로는 parseInt, inNaN 등이 있다. 그런데 왜, window.parseInt() 이렇게 써야 하는데 왜 그냥 써도

작동하는 것일 까? window는 전역객체이기 때문이다. 모든 객체를 다 포함하고 있기 때문에

window는 그냥 생략 가능하다. 자료형 , 우리가 생성한 변수 등 모든 것들을 포함하고 있다.

 

우리가 생성한 변수가 window에 있는지 보자

 

window 객체의 대표적인 메소드에는 ,

 

close() - 현재 창 닫기

 

open() - 새창 열기

 

encodeURI() , decodeURI() - 주소에 한글이 들어가면 한글이 이상한 글자로 변환된다.

 

이때, 한글을 이상한 글자로 바꾸려면 encodeURI()

이상한 글자를 한글로 바꾸려면 decodeURI()

 

setTimeout(함수,밀리초) - 밀리초 후 함수 실행 

setInterval(함수,밀리초) - 밀리초마다 함수 실행 

 

 

BOM

 

브라우저, 운영체제(OS) 대한 정보가 있다. (navigator.userAgent) 브라우저에 따라 다른 동작을 해야하거나,

IE 같은 이전에 쓰던 브라우저인지 체크 할 때 navigator 객체를 쓴다고 한다. GPS, 핸드폰의 battery를 체크 하는 기능(개발중)도 있기 때문에 모바일 환경에서도 유용하게 쓰인다고 한다!

 

내가 윈도우 10 64bit, 크롬 84버전을 쓰고있다는 것을 확인할 수 있다.

 

screen

 

화면에 대한 정보를 알려준다. 너비, 높이, 픽셀, 컬러, 화면 방향 등등 화면 크기에 따라 다른 동작을 하고 싶을 때

사용 한다고 한다!

loctaion 

주소에 대한 정보 , 새로고침, 다른 주소로 이동 , 등등이 있다 .

history

앞으로가기, 뒤로가기, 히스토리간 이동 등등 이 있다. 

pushState(객체, 제목, 주소) 메소드와, replaceState(객체, 제목, 주소)는 HTML5 에서 추가되었다고 한다.

페이지를 이동하지 않고 단순히 주소만 바꿔준다 ! 객체 부분에 페이지에 대한 정보를 추가할 수 있다.

단일 페이지 어플리케이션을 만들 때 자주 이용되고, 깜박임 없이, 바뀐 주소에 따른 액션을 취할 때

유용하게 사용한다고 한다!

이렇게, window 객체와 BOM 에 대해 간단하게 살펴보았다.

javascript는 워낙 방대한 내용이 있기 때문에 설명서만 1100쪽이 넘어간다고 한다.

 

내가 사용할 객체들을 완전히 외워서 사용하는 것 보다는 ,

어떤 객체가 있는지 알고, 메소드는 어떤 것인지 그때 그때 설명서를 보고 사용하는 것이 좋을 것 같다.