1. Introduction
웹 브라우저는 주기적으로 업데이트가 필요하다. 그 이유는 보안취약성 해결, 기능추가, 새로운 HTML,CSS, JavaScript 문법 지원이 있다.
현재는 2015년에 ECMA international에서 새롭게 배포한 버전인 ECMAScript2015가 사용되고 있다. ECMAScript2015는 ES6로 불리기도 한다.
새로운 ES6 문법을 적용하면서 가독성과 효율성이 증가되었지만 여전히 ES6가 적용되지 않는 브라우저들이 있다. 그렇기에 개발자들은 브라우저 호환성(compatibility) 문제를 신경써야한다.
브라우저 호환성 문제를 다루기 위한 두 가지 도구가 있다.
1) caniuse.com
HTML, CSS, Javascript 기능에 대한 웹 브라우저 호환성 정보를 제공하는 웹사이트이다.
2) Babel
ES6를 지원하지 않는 Javascript를 대부분의 웹 브라우저에서 사용되는 ES5로 전환시키는 Javascript 라이브러리이다.
var pasta = "Spaghetti"; // ES5 syntax
const meat = "Pancetta"; // ES6 syntax
let sauce = "Eggs and cheese"; // ES6 syntax
// Template literals, like the one below, were introduced in ES6
const carbonara = `You can make carbonara with ${pasta}, ${meat}, and a sauce made with ${sauce}.`;2. caniuse.com
대부분의 브라우저는 ES6를 지원하고 있지만 여전히 호환성 문제는 존재한다
- 사용자가 ES6를 지원하는 최신 웹 브라우저 버전으로 업데이트 하지 않는 경우
- 대부분의 웹 브라우저에서 몇 가지 ES6 기능을 지원하지 않는 경우(ex. modules)
caniuse.com을 이용해서 ES6 기능을 어떤 브라우저에서 지원하고 얼마나 사용되고 있는지 확인 할 수 있다.
3. Why ES6?
ES5에서 ES6로 업데이트 된 이유는 크게 세가지이다.
1 . 코드의 가독성과 경제성
새로운 문법은 더 짧은 코드를 사용해 더 이해햐기 쉽게 만든다.
2. ES5 버그
일부 ES5 문법에서 일반적인 버그가 발생되었다. ES6를 통해 이런 버그 발생을 완화 할 필요성이 있었다.
3. 다른 프로그래밍 언어와의 유사성
ES6는 JavaScript가 다른 객체지향 프로그래밍 언어(OOP)과 보다 유사하도록 만들었다. 이는 다른 비 자바스크립트 개발자가 자바스크립트를 배우기 쉽게 만든다.
4. Transpilation With Babel
caniuse.com를 이용해서 수동적으로 ES6를 ES5로 변환시킬 수 있지만 JavaScript 파일이 커질수록 수동변환은 적합하지 않다.
ES6는 하위호환이 되기 때문에 JavaScript 개발자들은 ES6를 ES5로 변화시키는 JavaScript 라이브러리를 개발했다. 바로 Babal이다.
Transpilation은 프로그래밍 언어를 다른 언어로 변환시키는 과정이다.
출처 Codeacademy
이하 babel을 사용하는 방법이 나오는데 codeacademy를 통해 배우기에는 적절하지 않아 추후 보강예정임.
