더북(TheBook)

src/index.js(코드 1-2)와 lib/index.js(코드 1-3)와 비교하면 몇 가지 변경 사항(공백 제외)만 확인된다. 먼저 바벨은 "use strict"를 추가했다(엄격 모드는 ES5에 추가된 기능이며 다양한 이유로 문제가 되는 몇 가지 동작을 수정해준다). 이것은 바벨의 기본값이지만 느슨한 모드에 의존하는 코드가 있다면 끌 수 있다.

하지만 흥미로운 점은 화살표 함수를 어떻게 다시 작성했는지다. checkArray 내에 _this라는 변수를 만들고 값을 this로 설정한 다음 some 콜백으로 기존 함수를 사용했다. 함수 내에서는 this 대신 _this를 사용했다. 이것은 화살표 함수에 대한 이전 설명과 잘 맞다. 매개변수를 넘겨주는 것처럼 this 넘겨주었다. 바벨은 ES5 환경이 이해할 수 있는 방식으로 그런 일을 했다.

이것은 분명히 아주 작은 예시일 뿐이지만 요점을 설명하고 프로젝트에서 이 작업을 수행할 때 사용할 수 있는 하나의 도구를 맛볼 수 있다. Gulp26, Grunt27, Webpack28, Browserify29, Rollup30 또는 그 무엇이든 바벨은 빌드 시스템과 통합할 수 있다. https://babeljs.io/docs/setup/#installation의 설치 페이지에는 모든 주요 엔트리에 대한 지침이 있다.

신간 소식 구독하기
뉴스레터에 가입하시고 이메일로 신간 소식을 받아 보세요.