ECMAScript

넷스케이프의 자바스크립트 1.0이 대성공을 거두었고, 넷스케이프 내비게이터 3가 출시된 직후 마이크로소프트에서는 인터넷 익스플로러 3를 출시했는데 여기 포함된 자바스크립트는 JScript라 불렀다. 마이크로소프트가 독자적으로 자바스크립트를 구현함에 따라 넷스케이프 내비게이터의 자바스크립트와 인터넷 익스플로러의 JScript 두 가지 자바스크립트 버전이 존재하게 되었다. 1997년 자바스크립트 1.1이 유럽 컴퓨터 제작 협회(European Computer Manufacturers Association: ECMA)에 제안되었다. ECMA는 기술 위원회 #39(Technical Committee: TC39)를 발족하여 “문법과 의미를 표준화하여 일반적인 목적에 쓸 수 있고 플랫폼을 가리지 않으며 제조사에 중립인 스크립트 언어”를 만들기로 하였다. TC39는 몇 달에 걸쳐 자바스크립트 1.1을 손질해 ECMA-262를 만들었고 이 표준은 ECMAScript라는 이름으로 정의되었다.

ECMA-262에서 정의한 ‘ECMAScript’ 언어는 웹 브라우저에 종속되지 않는다. 웹 브라우저는 ECMAScript를 구현하는 ‘호스트 환경’일 뿐이다. 호스트 환경은 ECMAScript를 기본적으로 구현하고 이 환경 자체의 인터페이스 구실을 하도록 디자인된 확장을 제공한다. 확장이란 문서 객체 모델 Document Object Model: DOM 같은 것을 말한다. ECMAScript는 단순히 명세에서 설명하는 부분들을 구현한 언어를 부르는 말일 뿐이다. 자바스크립트는 ECMAScript를 구현한 것이며 어도비 액션스크립트도 마찬가지이다.

문서 객체 모델

‘문서 객체 모델 Document Object Model: DOM‘은 XML을 HTML에서 사용할 수 있도록 확장한 애플리케이션 프로그래밍 인터페이스 application programming interface: API 이다. DOM은 전체 페이지를 노드의 계층 구조로 반환한다. HTML(XML) 페이지의 각 부분은 각기 다른 데이터를 포함하는 다양한 타입의 노드로 표현된다.

DOM이 필요한 이유

인터넷 익스플로러 4와 넷스케이프 내비게이터 4가 각기 다른 동적 HTML(DHTML)을 지원하면서 개발자들은 처음으로 웹 페이지를 새로고침하지 않고도 콘텐츠의 모양을 바꿀 수 있게 되었다. 하짐ㄴ 넷스케이프와 마이크로소프트가 개발한 DHTML은 서로 완전히 달랐으므로 개발자가 HTML 페이지를 단 하나만 만들면 모든 웹 브라우저에서 사용할 수 있던 시대는 끝났다. 플랫폼 독립적인 웹의 본성을 유지하기 위해 웹 통신 표준을 만들던 월드 와이드 웹 컨소시엄 World Wide Web Consortium: W3C 에서 DOM 관련 작업을 시작한 건 이때부터였다.

DOM 레벨

DOM 레벨 1은 문서 구조를 표현하는 것을 목표로 두 가지 모듈로 구성되었다. 하나는 DOM 코어인데 이 모듈은 XML 기반 문서를 노드 트리로 변환해 문서의 어느 부분이든 쉽게 접근하고 조작할 수 있게 한다. 다른 하나는 DOM HTML인데 이 모듈은 HTML에 밀접한 객체와 메서드를 DOM 코어에 추가해 확장한 것이다.

DOM 레벨 2는 다음 모듈을 도입해서 새로운 인터페이스를 담당하게 했다.

• DOM Views : 문서의 다양한 뷰, 예를 들어 CSS 스타일 적용 전후를 추적하는 인터페이스를 제공한다.
• DOM 이벤트 : 이벤트와 이벤트 처리에 관한 인터페이스이다.
• DOM 스타일 : CSS를 통해 요소의 스타일을 바꾸는 인터페이스이다.
• DOM 이동과 범위 : 문서 트리를 이동하고 조작하는 인터페이스이다.

DOM 레벨 3은 DOM을 더 확장해 문서를 저장하고 불러오는 통일된 방법(DOM 로드와 저장)과 문서가 유효한지 검사하는 방법(DOM 유효성 검사)을 제공한다. DOM 레벨 3의 코어는 XML 인포셋과 XPath, XML 베이스를 포함해 XML 1.0 전체를 지원하도록 확장되었다.

브라우저 객체 모델

인터넷 익스플로러 3와 넷스케이프 내비게이터 3은 ‘브라우저 객체 모델 Browser Object Model: BOM‘을 도입했는데 이는 브라우저 창에 접근하고 조작할 수 있게 하는 인터페이스이다. BOM을 이용하면 브라우저에 표시된 페이지와는 별개의 컨텍스트에서 브라우저와 상호작용할 수 있다. BOM의 고유한 특징인 동시에 자주 문제를 일으키는 점은 BOM을 주관하는 자바스크립트 표준이 존재하지 않는다는 점이다. 이러한 상황은 HTML5이 BOM을 공식 명세의 일부로 표준화하면서 개선되고 있다.

BOM은 일차적으로 브라우저 창과 프레임을 다루는 인터페이스긴 하지만 일반적으로는 브라우저에 고유한 자바스크립트 확장도 BOM의 일부로 간주한다. 다음 목록은 그러한 확장 일부이다.

• 브라우저 창을 새로 띄움
• 브라우저 창을 움직이거나 크기를 조절하고 닫음
• 브라우저의 상세 정보를 반환하는 navigator 객체
• 불러온 페이지의 상세 정보를 반환하는 location 객체
• 사용자의 화면 해상도에 대해 상세 정보를 반환하는 screen 객체
• 쿠키 지원
• XMLHttpRequest와 인터넷 익스플로러의 ActiveXObject 같은 커스텀 객체

window 객체나 navigator 객체 같은 사실상의 표준이 존재하긴 하지만 각 브라우저는 이들을 포함한 다른 객체의 프로퍼티와 메서드를 저마다 다르게 정의했다.

요약

자바스크립트는 웹 페이지와 상호작용하도록 디자인된 스크립트 언어이며 다음 세 부분으로 구성된다.

• ECMA-262에서 정의하는 ECMAScript : 핵심 기능을 제공한다.
• 문서 객체 모델(DOM) : 웹 페이지 콘텐츠를 조작하는 메서드와 인터페이스를 제공한다.
• 브라우저 객체 모델(BOM) : 브라우저와 상호작용하는 메서드와 인터페이스를 제공한다.