Window(전역객체) - BOM

Wiindow 객체 정의

Window 객체는 브라우저의 창(또는 프레임)을 가리키는 객체로, 모든 전역 객체와 전역 함수는 Window 객체의 프로퍼티와 메서드에 해당한다. 즉, Window 객체가 최상위 객체이며, 생략될 수 있기에 눈에 보이지 않을뿐, 모든 변수와 객체, 함수들이 Window 객체안에서 선언되고 실행되고 있다는 것이다.

var x = 6;  //window.x = 6 과 같다.
var y = 4;  //window.y = 4 와 같다.

window.document  //현재창의 document 프로퍼티(HTML 문서)접근
window.document.forms[0]  //현재창의 HTML 문서의 첫번째 폼 접근

• 모든 자바스크립트 구현에는 유효 범위 체인의 가장 앞에 전역 객체가 위치하며, 이 전역 객체의 프로퍼티들은 전역 변수들이다.
• 웹 브라우저 창을 조작할 수 있는 수많은 프로퍼티와 메서드들을 정의하며, 다른 객체(예: Document 객체)를 가리키는 프로퍼티들도 정의한다.
• 자기 자신을 참조하는 프로퍼티로 window와 self가 있다.
• 여러개의 창을 출력한 상태라면, 각각의 창은 고유의 window 객체를 지니며, 고유의 실행 컨텍스트를 정의하게 된다. 이는 첫번째 창에서 선언된 전역 변수는 다른 창에서는 전역 변수가 아니며, 첫번재 창의 전역변수에 접근하기 위해 다른 방법을 사용해야한다.

Window 객체 계층구조

Window 객체를 루트(root)로 하는 자바스크립트 객체들의 계층 구조를 도식화하면 아래와 같다.

그림출처 -http://www.ktword.co.kr/abbr_view.php?m_temp1=2519

Window 객체 프로퍼티

아래의 표는 The Window Object 의 내용을 옮겼다.

프로퍼티	설명
closed	창이 종료되었는지 여부를 나타내는 부울(bollean) 값을 반환한다.
defaultStatus	창의 상태표시줄의 텍스트를 반환하거나 설정한다.
document	창의 document 객체를 반환한다.
frameElement	현재 창에 삽입된 <iframe> 요소를 반환한다.
frames	현재 창에서 모든 <iframe> 요소를 반환한다.
history	창의 history 객체를 반환한다.
innerHeight	창의 콘텐츠 영역(뷰포트)의 내부 높이를 반환한다.
innerWidth	창의 콘텐츠 영역(뷰포트)의 내부 너비를 반환한다.
length	현재 창의 <iframe> 요소의 갯수를 반환한다.
localStorage	데이터를 저장하는데 사용되는 로컬 스토리지 객체에 대한 참조를 반환한다. 저장된 데이터는 유효기간이 없다.
location	창의 location 객체를 반환한다.
name	창의 이름을 반환하거나 설정한다.
navigator	창의 navigator 객체를 반환한다.
opener	창을 생성한 창에 대한 참조를 반환한다.
outerHeight	툴바 및 스크롤바를 포함하는 창의 외부 높이를 반환한다.
outerWidth	툴바 및 스크롤바를 포함하는 창의 외부 너비를 반환한다.
pageXOffset	창의 상부 좌측 구석으로부터 현재의 문서가 스크롤(수평) 된 픽셀를 반환한다.
pageYOffset	창의 상부 좌측 구석으로부터 현재의 문서가 스크롤(수직) 된 픽셀 반환한다.
parent	현재 창의 부모 창을 반환한다.
screen	창의 screen 객체를 반환한다.
screenLeft	데스크톱을 기준으로 창 화면의 X좌표를 반환한다.
screenTop	데스크톱을 기준으로 창 화면의 Y좌표를 반환한다.
screenX	데스크톱을 기준으로 창 화면의 X좌표를 반환한다.
screenY	데스크톱을 기준으로 창 화면의 Y좌표를 반환한다.
sessionStorage	데이터를 저장하는데 사용되는 로컬 스토리지 객체에 대한 참조를 반환한다. 저장된 데이터는 하나의 세션이다(브라우저 탭이 닫힐때 손실).
scrollX	pageXOffset 의 별칭이다.
scrollY	pageYOffset 의 별칭이다.
self	현재 창을 반환한다.
status	창의 상태표시줄의 텍스트를 반환하거나 설정한다.
top	최상위의 브라우저 창을 반환한다.

화면 좌표(screen coordinates)는 데스크톱 상에서 브라우저 창이 떠 있는 곳의 위치를 나타내며 데스크톱의 좌측 상단 모서리에서 상대적으로 계산된다.

창 좌표(window coordinates)는 웹 브라우저의 뷰포트(viewport, 화상표시영역)안의 위치를 나타내며, 뷰포트의 좌측 상단 모서리에서 상대적으로 계산된다.

문서 좌표(document coordinates)는 HTML 문서 안의 위치를 나타내며 문서의 좌측 상단 모서리에서 상대적으로 계산된다.

Window 객체 메서드

아래의 표는 The Window Object 의 내용을 옮겼다.

메서드	설명
alert()	메세지와 확인 버튼을 대화상자를 표시한다.
atob()	base-64로 인코딩 된 문자열을 디코딩한다.
blur()	현재 창에서 포커스를 제거한다.
btoa()	base-64로 문자열을 인코딩한다.
clearInterval()	setInterval()로 설정한 타이머를 제거한다.
clearTimeout()	setTimeout()로 설정한 타이머를 제거한다.
close()	현재 창을 닫는다.
confirm()	메세지 및 확인, 취소 버튼이 있는 대화상자를 표시한다.
focus()	현재 창을 포커스한다.
getComputedStyle()	현재 계산된 CSS 스타일 요소의 적용을 가져온다.
getSelection()	사용자에 의해 선택된 텍스트의 범위를 나타내는 selection 객체를 반환한다.
matchMedia()	지정된 CSS 미디어쿼리 문자열을 나타내는 mediaQueryList 객체를 반환한다.
moveBy()	현재 위치에 창을 상대적으로 이동시킨다.
moveTo()	지정된 위치에 창을 이동시킨다.
open()	새로운 브라우저 창을 생성한다.
print()	현재 창의 내용을 인쇄한다.
prompt()	방문자의 입력을 기다리는 대화상자를 표시한다.
resizeBy()	지정된 픽셀만큼 창 크기를 조정한다.
resizeTo()	지정된 너비와 높이로 창 크기를 조정한다.
scroll()	이 메서드는 scrollTo() 메서드로 대체되었다.
scrollBy()	지정된 픽셀의 수만큼 문서를 스크롤한다.
scrollTo()	지정된 좌표로 문서를 스크롤한다.
setInterval()	함수를 호출하거나 지정된 간격(밀리초)으로 표현식을 수행한다.
setTimeout()	함수를 호출하거나 지정된 밀리초의 수 이후에 표현식을 수행한다.
stop()	로딩중인 창을 중지한다.