window 오브젝트

DOM 문서를 담은 창을 의미한다.

document 속성이 창에 불러온 DOM 문서를 가리킨다.

전역변수고, 다양한 함수, 객체, 생성자를 호출할 수 있다.

탭 기능이 있는 브라우저는 각각의 탭을 각각의 window 객체로 나타낸다. 하지만 일부 속성과 메서드는 탭이 아니라 창에 적용된다. (ex - addEventListener의 resizeevent)

MessageEvent :

해당 객체를 통해 통신한다.

new MessageEvent(type)
new MessageEvent(type, options)

type은 보통 ‘message’로 되어 있고, 여러 프로퍼티 중 data 속성에 보내고 싶은 문자를 담는다.

postMessage() :

window 오브젝트 사이에서 안전하게 cross-origin 통신을 할 수 있게 하는 함수.

한 window는 다른 window를 참조할 수 있고, postMessage()를 통해 다른 window에 MessageEvent를 전송할 수 있다.

targetWindow.postMessage(message, targetOrigin, [transfer]);

위와 같이 사용한다.

targetWindow : 메세지를 전달할 window의 참조.

message: 직렬화 될 다양한 개체(data)

targetOrigin : 메세지를 받을 url
이때 targetOrigin을 *로 적게 되면 데이터 유출이 될 수 있으므로 지양해야한다.

다음은 window.open()과 postMessage()를 사용해 cross-origin 오류를 해결한 글이다.
https://velog.io/@qufdl0511/JavaScriptWindow.postMessage

전역 객체 중 자주 쓰이는 것들이 있다. document는 따로 DOM이라고 불리고, 나머지는 브라우저에 대한 정보를 가지고 있어 BOM이라고 불린다.

Navigator
: 브라우저, 운영체제에 대한 정보가 있다.(userAgent). 저번에 크롬북 버전으로 배포할 때 이 객체를 이용해 OS 별로 다르게 배포되도록 만들어봤었다.

Screen
화면에 대한 정보를 알려준다. 높이, 픽셀, 컬러, 화면 방향, 작업표시줄을 제외한 너비와 높이 등이 있다.

Location
주소에 대한 정보를 알려준다. (protocol, host, hostname, pathname, href, port, search 등등). location.reload()로 새로고침도 가능하다.

History
앞으로 가기, 뒤로가기 기능에 사용된다.