초심자라면 알아두어야 할 JS 생태계

자바스크립트를 공부하다보면 ES6, v8, Node.js, npm, jquery 등등 자주 접하는 개념들이 있다. 이 파트에서는 문법을 배우기 전에 초심자가 알아두면 좋은 주요 개념들을 ‘ECMA Script, JavaScript Runtime, Frameworks, Library, CSS in JavaScript, Module Bundlers’ 이 여섯 개의 자바스크립트 생태계로 분류하고 소개한다. 이 자바스크립트 생태계에 대한 큰 개념을 이해하고 나면 이후 소개하는 문법을 습득하거나 향후 다른 프레임워크를 공부할 때에 도움이 될 것이다.

1. ECMA Script 의 등장

1-1. ECMA Script의 탄생 배경

1996년 3월, 당시의 웹브라우저 시장 점유율 90%를 차지하던 넷스케이프 커뮤니케이션즈 (이하 넷스케이프 사) 는 네비게이터 2.0을 출시하면서 자바스크립트를 단기간에 개발하여 지원하기 시작했다.

<aside> 💡 당시 JavaScript 언어는 10일만에 개발되어 배포었다. 짧은 기간 내 개발이 되어 배포되었기에 당시 개발되었던 철학이 지금에는 맞지 않는 경우가 있어 이를 보완하는 기능이 추가되어 왔다. 기능이 수정되면 웹 상에서 이전 코드가 작동하지 않는 상황이 발생될 수 있어 꽤나 긴 시간을 두고 업데이트를 진행한다.

typeof null == “object” 는 실수임을 인정하는 JavaScript 개발자Brendan Eich(브랜든 아이크)

typeof null == “object” 는 실수임을 인정하는 JavaScript 개발자Brendan Eich(브랜든 아이크)

</aside>

이후 웹 페이지 동작을 향상시키는 경량의 프로그래밍 언어가 인기를 끌자 Microsoft사 에서 IE 3.0에서 동작하는 ‘JScript’라는 매우 비슷한 언어를 만들어 냈고 IE 이외에도 다양한 브라우저들이 자바스크립트 문법을 만들어 내게 된다.

이로인해 동일한 코드일지라도 브라우저에 따라 웹페이지가 개발자의 의도대로 정상 동작하지 않는 크로스 브라우징 이슈가 빈번하게 발생하면서 표준화된 자바스크립트의 필요성이 대두되기 시작했다. 이를 위해 1996년 11월, 넷스케이프 사는 ECMA 인터네셔널에 자바스크립트의 표준화를 요청한다. 그 결과 1997년 7월, 자바스크립트의 표준화 초판이 완성되었고 2015년도 부터는 매 해 새로운 문법이 추가되어 배포되고 있다.

한마디로 ECMA Script는 ECMA 인터내셔널에서 정의한 ECMA-262 기술 규격을 토대로 만든 표준 스크립트 프로그래밍 언어이며, 자바스크립트의 뼈대를 구성하는 언어이다.

<aside> 💡 ECMA 인터네셔널 (Ecma International) : 정보 통신 시스템을 표준화하는 비영리 협회. [1]

</aside>

1-2. ECMA Script version

개발을 공부하다보면 ‘ES6부터 도입된 문법입니다.’ 라는 말을 많이 듣게 되는데, 왜 유독 ES6에 대한 언급이 많은 것일까?

사실 ES2015 (ES6를 의미하며, ES6부터는 배포 연도로 이름을 명명한다) 이전 버전의 문법에는 크고작은 불편함이 많았다. 하지만, ES2015 부터 ES5이하 명세에서 문제가 되던 부분들을 속 시원히 해결하는 const, let, Promise, Arrow function, Class 등의 문법들이 대거 추가되면서 가독성이나 유지보수성이 크게 향상되었다. 이러한 변화를 가져온 덕에 ES2015(ES6)에 대한 언급이 많다는 점을 알아두자.

ECMA Script는 현재까지 ES2022/ES13 버전이 배포 되었고 계속 업데이트 되고 있다. 2022년에는 class 속성과 관련된 내용이 주를 이루고 있다. 따라서 우리는 매해 업데이트 되는 문법을 확인하고 반영해가며 개발해야한다는 점을 잊지말자. 아래 ECMA-인터내셔널 공식 사이트에서 ES 버전의 update를 확인할 수 있다.

Home - Ecma International