상세 컨텐츠

본문 제목

자바스크립트 | 크로스 브라우징과 ECMAScript

FrontEnd/Java Script

by 유후(yufu) 2023. 1. 17. 00:38

본문

반응형

1. 크로스 브라우징의 배경

1996년 8월, 마이크로소프트는 자바스크립트의 파생 버전인 JScript를 인터넷 익스플로러 3.0에 탑재했습니다. 그런데 문제는 JScript와 자바스크립트가 표준화되지 못하고 적당히 호환되었다는 것입니다. 즉, 넷스케이프 커뮤니케이션즈와 마이크로소프트는 자사 브라우저의 시장 점유율을 높이기 위해 자사 브라우저에서만 동작하는 기능을 경쟁적으로 추가하기 시작했다는 것입니다.

이로 인해 브라우저에 따라 웹페이지가 정상적으로 동작하지 않는 크로스 브라우징 이슈가 발생하기 시작했고, 결과적으로 모든 브라우저에서 정상적으로 동작하는 웹페이지를 개발하기가 무척 어려워졌습니다. 이에 자바스크립트의 파편화를 방지하고 모든 브라우저에서 정상적으로 동작하는 표준화된 자바스크립트의 필요성이 대두되기 시작했습니다. 이를 위해 1996년 11월, 넷스케이프 커뮤니케이션즈는 컴퓨터 시스템의 표준을 관리하는 비영리 표준화 기구인 ECMA 인터내셔널에 자바스크립트의 표준화를 요청합니다.

 

2. 크로스 브라우징(Cross Browsing)

브라우저마다 렌더링 엔진이 달라 호환성 문제로 브라우저에 따라 웹페이지가 정상적으로 동작하지 않는 것을 말합니다. 크로스 브라우징의 배경은 자바스크립트가 개발 되고 뒤이어 파생 버전인 JScript가 나왔을 때입니다. 완전히 호환되지 않는 두 언어로 인해 브라우저에 따라 웹페이지가 정상적으로 동작하지 않는 문제가 발생하기 시작했고, 결과적으로 모든 브라우저에서 정상적으로 동작하는 웹페이지를 개발하기 어려워졌습니다. 크로스 브라우징은 자바스크립트의 파편화를 방지하고 모든 브라우저에서 정상적으로 동작하는 표준화된 자바스크립트의 필요성이 대두되는 계기가 되기도 했습니다.

 

3. 자바스크립트 표준화

크로스 브라우징 이슈로 인해 자바스크립트의 파편화를 방지하고 모든 브라우저에서 정상적으로 동작하는 표준화된 자바스크립트의 필요성이 대두되면서 이를 위해 넷스케이프 커뮤니케이션즈가 ECMA 인터내셔널에 자바스크립트 표준화를 요청합니다. 표준화된 자바스크립트는 ECMAScript로 명명되었습니다.

 

4. ECMAScript 버전별 특징

버전 출시연도 특징
ES1 1997 초판
ES2 1998 ISO/IEC 16262 국제 표준과 동일한 규격을 적용
ES3 1999 정규 표현식, try … catch
ES5 2009 HTML5와 함께 출현한 표준안. JSON, strict mode, 접근자 프로퍼티, 프로퍼티 어트리뷰트 제어, 향상된 배열 조작 기능(forEach, map, filter, reduce, some, every)
ES6 2015 let/const, 클래스, 화살표 함수, 템플릿 리터럴, 디스트럭처링 할당, 스프레드 문법, rest 파라미터, 심벌, 프로미스, Map/Set, 이터러블, for … of, 제너레이터, Proxy, 모듈 import / export
ES7 2016 지수(**) 연산자, Array.prototype.includes, String.prototype.includes
ES8 2017 async/await, Object 정적 메서드(Object.values, Object.entries, Object.getOwnPropertyDescriptors)
ES9 2018 Object rest/spread 프로퍼티, Promise.prototype.finally, async generator, for await … of
ES10 2019 Object.fromEntries, Array.prototype.flat, Array.prototype.flatMap, optional catch binding
ES11 2020 String.prototype.matchAll, BigInt, globalThis, Promise.allSettled, null 병합 연산자, 옵셔널 체이닝 연산자, for … in enumeration order

 

출처 : 모던 자바스크립트 딥 다이브

반응형

관련글 더보기