[모던 자바스크립트 Deep Dive] 2장 자바스크립트란?

이웅모, 위키북스

---

2.1 자바스크립트의 탄생

1995년 브렌던 아이크가 브라우저에서 동작하는 경량 프로그래밍 언어 도입을 위해 개발

 

2.2 자바스크립트의 표준화

초기 크로스 브라우징 이슈 발생으로 자바스크립트의 표준화 필요성 대두

→ 1997년 표준화된 자바스크립트 초판 ECMAScript 1 출시

2009년 ECMAScript 5, ES5가 HTML5와 함께 표준 사양으로 출현

2015년 ECMAScript 6, ES6 출시

→ 범용 프로그래밍 언어로서 갖춰야 할 기능들을 대거 도입. 정규 표현식 사용

 

2.3 자바스크립트 성장의 역사

초창기 자바스크립트: 웹페이지의 보조적인 기능만 수행

→ 대부분의 로직은 웹 서버에서 주로 실행, 브라우저는 서버로부터 전달받은 HTML과 CSS를 단순 렌더링

 

1. Ajax

1999년 자바스크립트를 이용해 서버와 브라우저가 비동기 방식으로 데이터를 교환할 수 있는 통신 기능 구현

기존의 웹페이지는 완전한 html 코드를 매 화면 전환마다 서버로부터 전송받아 웹페이지 전체를 렌더링하는 방식이었음

→ 불필요한 데이터 통신, 저성능, 화면 전환마다 깜빡임 현상

Ajax를 통해 서버로부터 필요한 데이터만 전송받아 웹페이지에서 변경해야 하는 부분만 한정적으로 렌더링할 수 있게 됨

→ 웹 브라우저에서도 데스크톱 애플리케이션과 유사한 빠른 성능과 부드러운 화면 전환이 가능해짐

 

2. jQuery

2006년 등장

DOM을 쉽게 제어, 크로스 브라우징 이슈 일부 해결

 

3. V8 자바스크립트 엔진

빠른 성능 제공

 

4. Node.js

2009년 라이언 달이 발표

구글 V8 자바스크립트 엔진으로 빌드된 자바스크립트 런타임 환경

브라우저의 자바스크립트 엔진에서만 동작하던 자바스크립트를 브라우저 이외의 환경에서도 동작할 수 있도록 자바스크립트 엔진을 브라우저에서 독립시킴 → 자바스크립트가 범용 프로그래밍 언어로 성장

동형성 특징: 프론트엔드와 백엔드 영역에서 자바스크립트를 사용 가능 → 별도 언어 학습 시간 감소

비동기 I/O 지원

단일 스레드 이벤트 루프 기반으로 동작 → 요청 처리 성능 좋음

≫ 데이터 실시간 처리를 위해 I/O가 빈번하게 발새하는 SPA에 적합 / CPU 사용률이 높은 앱에는 비권장

크로스 플랫폼 특징: 웹, 모바일 하이브리드 앱, 서버 사이드, 데스크톱, 머신러닝, 로보틱스 환경에서 모두 사용 가능

 

5. SPA(Single Page Application) 프레임워크

CBD 방법론을 기반

Angular, React, Vue.js, Svelte 등

 

2.4 자바스크립트와 ECMAScript

자바스크립트 표준 사양 ECMA-262가 핵심 문법 규정, 각 브라우저 제조사에서 해당 사양을 준수해서 브라우저에 내장되는 자바스크립트 엔진 구현

자바스크립트는 일반적으로 ECMAScript(=ECMA-262)와 브라우저가 별도 지원하는 클라이언트 사이드 Web API(DOM, BOM, Canvas, XMLHttpRequest, fetch, requestAnimationFrame, SVG, Web Storage, Web Component, Web Worker 등을 아우르는 개념)를 포함

 

2.5 자바스크립트의 특징

웹 브라우저에서 동작하는 유일한 프로그래밍 언어

인터프리터 언어

대부분의 모던 자바스크립트 엔진은 인터프리터와 컴파일러의 장점을 결합 → 인터프리터가 소스코드 즉시 실행하고 컴파일러가 빠르게 동작하는 머신 코드를 생성해 최적화 → 빠른 코드 실행

명령형, 함수형, 프로토타입 기반, 객체지향 프로그래밍을 지원하는 멀티 패러다임 프로그래밍 언어

 

2.6 ES6 브라우저 지원 현황

대부분 지원하지만 인터넷 익슬플로러나 구형 브라우저 비지원 → 바벨과 같은 트랜스파일러로 소스코드를 다운그레이드시켜야 함