객체모델
우리가 보는 웹사이트를 포함해 웹브라우저의 구성요소는 객체로 이루어져있다. 또한 자바스크립트는 객체를 제어함으로서 웹브라우저를 제어한다.
(객체를 제어한다= 객체의 메소드를 호출하거나 객체의 프로퍼티를 가져옴으로서 객체가 가르키고 있는 태그를 제어한다는 뜻)
전역 객체 window가 객체 트리에서 최상위에 위치하고, 그 아래로 객체모델은 크게 3가지로 나누어진다.
1. 기본 내장 객체 모델(javascript core)
자바스크립트 엔진에 내장되어있다.
예: Object
Function
Boolean
Symbol
그 외 기본 내장 객체 모델의 종류
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects
2.브라우저 객체 모델 (BOM)
크롬과 같은 브라우저 안에 내장되어있다.
객체 종류
3.문서 객체 모델(DOM)
HTML을 조작 하기 위한 객체
BOM VS DOM
공통점
BOM 객체들은 window 객체의 프로퍼티로서 존재하며, window 객체의 document 프로퍼티는 DOM 객체들이 이루는 트리의 최상단에 위치한다.
BOM과 DOM은 둘 다 JavaScript와 같은 스크립트 언어가 웹 브라우저/페이지를 쉽게 제어 및 조작할 수 있도록 한다는 점에서 공통점이 있다.
차이점
DOM이 웹 브라우저가 열고 있는 각 웹 페이지(문서)의 내용을 객체들로 표현하는 형식이라면, BOM은 해당 페이지를 열고 있는 '웹 브라우저 자체'를 객체들로 표현하는 형식을 말한다.
즉, 웹 브라우저는 실행되는 순간부터 내부 메모리에 웹 브라우저 자체에 대한 여러 정보들을 담고 있는 BOM 객체들을 생성함으로써 자기 자신(웹 브라우저)을 표현한다.
이를 통해, 그 위에서 동작하는 JavaScript 등의 스크립트 언어가 웹 브라우저를 쉽게 제어하고 조작할 수 있게 되는 것이다.
참고
https://velog.io/@wiostz98kr/TIL25-l-Window-BOM
https://opentutorials.org/course/1375/6622
