ECMAScript란 무엇인가?
ECMA는 'European Computer Manufacturers Association', 즉 유럽 컴퓨터 제조업체 협회의 약자입니다. ECMAScript는 자바스크립트(JavaScript), JScript 등 다양한 스크립팅 언어의 표준 규격을 의미하며, 스크립트 언어 명세의 상표이기도 합니다. 즉, 자바스크립트는 ECMAScript 표준을 기반으로 만들어진 언어이며, 오늘날 가장 널리 사용되는 ECMAScript 구현체 중 하나로 꼽힙니다.
웹 브라우저별 ES6 지원 현황
ECMAScript 6(ES6)는 Chrome, Microsoft Edge, Safari 등 주요 웹 브라우저에서 정상적으로 동작합니다. 발표 당시 기준으로 브라우저별 호환성은 다음과 같습니다.
- Chrome – 약 90% 호환성
- Microsoft Edge – 약 80% 호환성
- Safari – 약 54% 호환성
참고로 최신 버전의 주요 브라우저들은 현재 ES6 기능 대부분을 거의 완벽하게 지원하고 있습니다. 다만 구형 브라우저까지 함께 고려해야 하는 서비스라면, 아래에서 소개하는 트랜스파일러 활용이 좋은 대안이 됩니다.
Babel로 하위 호환성 확보하기
ES6 코드를 구버전 문법만 이해하는 브라우저에서도 실행하려면 Babel과 같은 전처리기(트랜스파일러)를 사용하는 것이 일반적입니다. Babel은 최신 자바스크립트 코드를 ECMAScript 5 호환 코드로 변환해 주기 때문에, 개발자는 최신 문법의 편리함을 그대로 누리면서도 폭넓은 브라우저 지원을 유지할 수 있습니다.
ECMAScript 6의 주요 기능
1. 화살표 함수(Arrow Functions)
기존의 function 표현식 대신 => 문법으로 함수를 선언할 수 있습니다. 코드가 훨씬 간결해질 뿐만 아니라, this 바인딩 방식이 직관적이어서 콜백 함수를 작성할 때 특히 유용합니다.
2. ES6 모듈(Modules)
ES6부터 모듈이 웹 브라우저의 네이티브 자바스크립트 기능으로 공식 제공됩니다. 모듈을 활용하면 코드를 관리하기 쉬운 단위로 분리할 수 있어, 코드 정리와 유지보수가 한결 수월해집니다.
3. 클래스(Classes)
ES6 릴리스와 함께 자바스크립트에도 클래스 문법이 도입되었습니다. 이를 통해 상속, 생성자 등 객체 지향 프로그래밍(OOP) 패턴을 더욱 명확하고 체계적으로 구현할 수 있게 되었습니다.