[기본부터 탄탄한 개발공부] 2장 자바스크립트란?

해당 글은 모던 자바스크립트 DEEP DIVE를 보고 정리한 글입니다

 

2.1 자바스크립트의 탄생

 

넷스케이프 커뮤니케이션즈는 브라우저에서 동작하는 경량 프로그래밍 언어를 도입하기로 결정한다

이렇게 탄생한 것이 브렌던 아이크가 개발한 자바스크립트다

 

2.2  자바스크립트의 표준화

 

초기에는 크로스 브라우징 이슈때문에 모든 브라우저에 정상적으로 동작하는 웹페이지를 개발하기 어려웠다

 

버전	출시연도	특징
ES1	1997	초안
ES2	1998	ISO/IEC 16262 국제 표준과 동일한 규격을 적용
ES3	1999	정규표현식, try...catch
ES5	2009	HTML5와 함께 출현한 표준안. JSON, strict mode, 접근자 프로퍼티, 프로퍼티 어트리뷰트 제어, 향상된 배열 조작 가능(forEach, map, filter, reduce, some, every)
ES6	2015	지수(**) 연산자, Array.prototype.includes, String.prototype.includes
ES8	2017	async/await, Object 정적 메서드(Object.valures, Object.entries, Object.getOwnPropertyDescriptors)
ES9	2018	Oject rest/spread 프로퍼티, Promise.prototype.finally, async generator, for await...of
ES10	2019	Object.fromEntries, Array.prototype.flat, Array.prototype.flatMap, optional catch binding
Es11	2020	String.prototype.matchAll, BigInt, globalThis, Promise.allSettled, null 병합 연산자, 옵셔널 체이닝 연산자, for...in enumeration order

 

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

 

* 렌더링 : HTML, CSS, 자바스크립트로 작성된 문서를 해석해서 브라우저에 시각적으로 출력하는 것

 

2.3.1 Ajax

 

1999년, 자바스크립트로 서버와 브라우저가 비동기 방식으로 데이터를 교환할 수 있는 통신 기능인 Ajax가 XMLHttpRequest라는 이름으로 등장

 

예전에는 웹페이지 전체를 렌더링하는 방식으로 동작했음 -> 화면 바뀌면 새로운 HTML을 전송받아 처음부터 다시 렌더링 했음 -> 불필요한 부분까지 렌더링해서 성능면에서 불리

 

But! Ajax의 등장으로 서버로부터 필요한 데이터만 전송받음 -> 부드러운 화면 전환이 가능

2005년, 구글이 발표한 구글 맵스는 웹 프로그래밍 언어로서 자바스크립트의 가능성을 확인하는 계기를 마련함

Ajax를 기반으로 동작하는 구글맵스는 데스크톱 애플리케이션과 비교해도 손색없는 성능과 부드러운 화면 전환을 보여줌

 

2.3.1 JQuery

 

2006년, 제이쿼리 등장으로 DOM을 쉽게 제어하게 됨. 제이쿼리로 넓은 사용자 층을 순식간에 확보

 

2.3.3 V8 자바스크립트 엔진

 

2008년에 등장한 구글의 V8 자바스크립트 엔진은 빠른 성능을 보여줌

덕분에 자바스크립트는 데스크톱 애플리케이션과 유사한 사용자 경험을 제공할 수 있는 웹 프로그래밍 언어로 정착

V8 자바스크립트 엔진으로 서버에서 수행했던 로직이 클라이언트(브라우저)로 대거 이동

프론트엔드 영역 주목받는 계기가 됨

 

2.3.4. Node.js

 

2009년, 라이언 딜이 발표한 Node.js는 V8 자바스크립트 엔진으로 빌드된 자바스크립트 런타임 환경임

 

Node.js는 자바스크립트를 브라우저 이외의 환경에세도 동작할 수 있도록 자바스크립트 엔진을 브라우저에서 독립시킨 자바스크립트 실행환경이다.

 

비동기 I/O를 지원, 단일 스레드 이벤트 루프 기반으로 동작함 -> 요청처리 성능이 좋음

따라서 실시간 데이터 처리를 위해 I/O가 빈번한 SPA에 적합. CPU 사용률이 높은 앱은 노권장

 

Node.js의 등장으로 자바스크립트는 범용 프로그래밍 언어가 됨

 

2.3.5 SPA 프레임워크

 

개발복잡도가 증가된 환경에서 필요에 따른 패턴과 라이브러리가 출현함.

 

CBD 방법론을 기본으로 하는 SPA가 대중화 되면 앵귤러, 뷰, 리엑트, 스벨트와 같은 SPA 프레임워크/라이브러리 등장

 

2.4 자바스크립트와 ECMAScript

 

ECMAScript : 자바스크립트의 표준 사양인 ECMA-262를 말함. 프로그래밍 언어의 값, 타입, 객체와 프로퍼티, 함수, 표준 빌트인 객체와 같은 핵심 문법을 규정.

 

자바스크립트 : 프로그래밍 언어.  클라이언트 사이드 Web APPI, 즉 DOM, BOM, Canvas, XMLHttpRequest, fetch, requestAnimationFrame, SVG, Web Storage, Web Component, Web Worker 등을 아우르는 개념

 

2.5  자바스크립트 특징

 

• HTML, CSS와 함께 웹을 구성하는 요소 중 하나
• 브라우저에서 동작하는 유일한 프로그래밍 언어
• 개발자가 컴파일 작업을 수행하지 않는 인터프리터 언어
• 명령형, 함수형, 프로토타입 기반, 객체지향 프로그램을 지원하는 멀티 패러다임 프로그램 언어

 

2.6 ES6 지원현황

 

익스말고 거의 다 지원됨