Babel과 Polyfill

Babel이란?

babel의 공식페이지(https://babeljs.io/)에 들어가보면 이렇게 쓰여있다.

Babel is a JavaScript Compiler.

바벨은 자바스크립트 컴파일러라고 설명되어 있다. 특이하게도 자바스크립트를 자바스크립트로 컴파일해준다.

최신 버전의 자바스크립트 문법은 브라우저가 지원하지 않는 경우가 있다. 대표로 IE 브라우저인데 이 브라우저는 ES6의 문법은 대부분 지원하지 않는다. 그렇다면 개발자는 다양한 브라우저 지원을 위해 최신문법을 사용하면 안될까? 아니다. 그때 사용되는 것이 바로 이 바벨이다.

바벨은 개발자가 ES6, ES7 등의 최신 문법을 사용해서 개발을 진행하도록 하고 프로젝트가 빌드 될 때 문법을 낮은 버전의 문법으로 컴파일해준다. 그렇게 된다면 개발은 최신문법으로, 브라우저 지원은 다양하게 가능하게 됩니다.

Polyfill

바벨은 최신버전의 문법을 낮은 버전의 문법으로 변환해주는 역할하지만 높은 문법에서 사용되는 ES6이상에서 새롭게 추가된 Promise, Map, Set 같은 전체들은 바벨의 컴파일만으로는 완벽하게 변환이 불가능ㅎ합니다. 이때 사용되는 것이 Polyfill입니다. Polyfill은 높은 버전의 문법에서 추가된 새로운 전역 객체들을 사용가능한 객체로 바꿔줍니다. 이렇게 변환이 이루어지면 낮은 버전의 문법만 지원하는 브라우저에서도 구동이 가능해 다양한 브라우저를 지원 할 수 있습니다.