728x90
1. 자바스크립트의 탄생
- 1995년 넷스케이프 커뮤니케이션즈가 웹페이지의 보조적인 기능을 수행하기 위해 경량 프로그래밍 언어를 도입하기로 함, 브렌던 아이크가 자바스크립트를 개발
- 1996년 3월, 넷스케이프의 웹브라우저 넷스케이프 내비게이터2에 '모카'라는 이름으로 탑재 됨. 모카->라이브스크립트->자바스크립트로 이름 변경
- 얼마 후 마이크로소프트가 Jscript를 출시하여 위기
2. 자바스크립트의 표준화
- 1996년 마이크로소프트가 'JScript'를 인터넷 익스플로러 3.0에 탑재
- 자사 웹브라우저에서만 동작하는 기능을 추가해 넷스케이프와 마이크로소프트가 대립, 크로스브라우징 이슈 발생, 모든 브라우저에서 동작하는 웹페이지 개발이 어려워짐
- 1996년 11월 넷스케이프가 컴퓨터 시스템의 표준을 관리하는 ECM 인터내셔널에 자바스크립트 표준화 요청
- 1997년 ES1 ECMAScript로 명명. 1997년 ES3(정규 표현식 try, catch), 2015년 ES6(let/const, 화살표 함수, 클래스, 모듈 등) 도입
3. 자바스크립트 성장의 역사
- 초창기 자바스크립트는 서버로부터 전달받은 HTML과 CSS를 단순히 렌더링하는 수준이었음
- 렌더링 : HTML,CSS, 자바스크립트로 작성된 문서를 해석해서 브라우저에 시각적으로 출력하는 것, 서버에서 데이터를 HTML로 변환해서 브라우저에게 전달하는 과정(SSR:Server Side Rendering)을 가리킴
- Ajax (Asynchronous JavaScript and XML XMLhttpRequest)
- 1999년 등장. 자바스크립트를 이용해 서버와 브라우저가 비동기 방식으로 데이터를 교환할 수 있는 통신 기능
- 이전 웹페이지는 완전한 HTML 코드를 서버로부터 전송받아 웹페이지 전체를 렌더링하는 방식으로 동작
- 변경할 필요가 없는 부분까지 포함된 HTML 코드를 서버로부터 다시 전송받기에 불필요한 데이터 통신이 발생 (화면 전환 시 깜빡이는 현상)
- Ajax 서버로부터 필요한 데이터만 전송받아 변경해야하는 부분만 한정적으로 렌더링 -> 부드러운 화면전환 가능 (ex. 2005년 ajax 기반의 구글 맵스 발표)
- jQuery
- 2006년 등장. DOM을 더욱 쉽게 제어, 크로스 브라우징 이슈 해결
- 배우기 쉽고 직관적이어서 인기
- V8 자바스크립트 엔진
- 더욱 빠르게 동작하는 자바스크립트 엔진의 등장으로 자바스크립트는 데스크톱 애플리케이션과 유사한 사용자 경험을 제공할 수 있는 웹 애플리케이션 프로그래밍 언어로 정착
- Node.js
- 2009년 라이언 달이 발표. 구글 V8 자바스크립트 엔진으로 빌드된 자바스크립트 런타임 환경
- 브라우저의 자바스크립트 엔진에서만 동작하던 자바스크립트를 브라우저 이외의 환경에서 동작할 수 있도록 자바스크립트 엔진을 브라우저에서 독립시킨 자바스크립트 실행 환경
- 서버 사이드 애플리케이션 개발에 주로 사용
- Node.js 환경에서 동작하는 애플리케이션은 자바스크립트를 사용해 개발
- 데이터를 실시간으로 처리하기 위해 I/O가 빈번하게 발생하는 SPA* 에 적합
- 비동기 I/O* 지원. 단일 스레드 이벤트 루프 기반으로 동작하여 요청 처리 성능 좋음
- Node.js의 등장으로 자바스크립트는 서버 사이드 애플리케이션 개발에도 사용할 수 있는 범용 프로그래밍 언어로 부상, 웹프로그래밍 언어의 표준
- SPA 프레임워크
- 모던 웹 애플리케이션의 개발규모와 복잡도 상승 -> 패턴과 라이브러리 등장 -> 변경에 유연하고 확장하기 쉬운 프레임워크 등장
- CBD(Component Based Development) 방법론을 기반으로 하는 SPA 대중화. Angular, React , Vue.js, Svelte 등의 다양한 프레임워크/라이브러리가 사용층 확보
- Ajax (Asynchronous JavaScript and XML XMLhttpRequest)
4. 자바스크립트와 ECMAScript
- 자바스크립트 표준 사양 ECMA-262. 프로그래밍 언어의 값, 타입, 객체와 프로퍼티, 함수, 표준 빌트인 객체 등 핵심 문법 규정
- 브라우저 제조사는 ECMAScript 사양을 준수하여 브라우저에 내장되는 자바스크립트 엔진 구현
- 자바스크립트 : ECMAScript + 클라이언트 Web API (브라우저가 별도 지원 -> DOM, BOM, Canvas, XMLHttpRequest, fetch, requestAnimationFrame, Web Stroage, Web Component, Web Worker)
- 클라이언트 Web API는 월드 와이드 웹 콘소시엄 (W3C)에서 별도의 사양으로 관리, 자세한 내용은 MDN web docs의 Web API 페이지 참고
5. 자바스크립트의 특징
- 웹 브라우저에서 동작하는 유일한 프로그래밍 언어
- 개발자가 별도의 컴파일 작업을 수행하지 않는 인터프리터 언어.
- 명령형, 함수형, 프로토타입 기반 객체지향 프로그래밍 지원하는 멀티 패러다임 프로그래밍 언어.
- 클래스 기반 객체지향 언어보다 효율적이고 강력한 프로토타입 기반의 객체지향 언어
6. ES6 지원 현황
- 인터넷 익스플로러 96~99%, 구형 익스플로러는 대부분 지원하지 않음
- 브라우저에서 아직 지원하지 않는 최신 기능을 사용하거나 구형 브라우저 고려해야할 때 바벨이라는 트랜스파일러를 사용할 수 있음
- ES6로 구현한 소스코드를 ES5 이하의 사양으로 다운그레이드 해줌
*I/O : 입력과 출력
*SPA : single page appication
참고 : 모던 자바스크립트 Deep Dive
728x90
'TIL > JavaScript' 카테고리의 다른 글
[딥다이브] 6장 데이터 타입 (0) | 2022.04.20 |
---|---|
[딥다이브] 5장 표현식과 문 (0) | 2022.04.20 |
[딥다이브] 4장 변수 (0) | 2022.04.20 |
[딥다이브] 3장 자바스크립트 개발 환경과 실행 방법 (0) | 2022.04.17 |
[딥다이브] 1장 프로그래밍 (0) | 2022.04.17 |