2. 자바스크립트란?
in 모던자바스크립트
자바스크립트의 탄생
- 1995년, 웹페이지의 보조적인 기능을 수행하기 위해 브라우저에서 동작하는 경량 프로그래밍 언어 도입.
- 현재, 모든 브라우저의 표준 프로그래밍 언어로 자리 잡음
- but 자바스크립트의 파생 버전인 JScript가 출시되어 위기를 맞음
자바스크립트의 표준화
- 1996년, 마이크로소프트가 JScript 탑재.
- JScript와 JS가 표준화되지 못하고 적당히 호환
- 이로 인해 브라우저에 따라 웹페이지가 정상적으로 동작하지 않는 크로스 브라우징 이슈가 발생
- js의 파편화를 방지하고, 모든 브라우저에서 정상적으로 동작하는 표준화된 js의 필요성이 대두됨
- 1996년, 컴퓨터 시스템의 표준을 관리하는 비영리 표준화 기구인 ECMA 인터네셔널에 js의 표준화 요청
- 2015년에 공개된 ES6는 let/const, 화살표 함수, 클래스, 모듈 등과 같이 범용 프로그래밍 언어로서 갖춰야 할 기능들을 대거 도입
자바스크립트 성장의 역사
- 초창기 js는 웹페이지의 보조적인 기능을 수행하기 위해 한정적인 용도로 사용
- 이때는 주요 로직은 백엔드이며, 브라우저는 서버로부터 전달받은 html과 css를 단순히 렌더링 하는 수준
Ajax
- 1999년, js를 이용해 서버와 브라우저가 비동기 방식으로 데이터를 교환할 수 있는 통신 기능인 Ajax 등장
- 이전에는 all html코드를 서버로부터 받아 전체를 렌더링하는 방식. (변경할 필요 없는 부분도 싹다 다시 렌더링)
- 이로 인해, 성능 저하 및 화면이 전환되면 화면이 순간적으로 깜빡이는 현상 발생
- Ajax 등장 이후, 서버로부터 필요한 데이터만 전송받아 변경해야 하는 부분만 한정적으로 렌더링하는 것이 가능해짐.
- 이로써, 웹 브라우저에서도 데스크톱 애플리케이션과 유사한 빠른 성능과 부드러운 화면 전환이 가능해짐
- 2005년, 구글 맵스를 통해 js의 웹 애플리케이션 프로그래밍 언어로서의 가능성이 확인됨
jQuery
- 2006년 등장하여 DOM을 더욱 쉽게 제어하고, 크로스 브라우징 이슈도 해결해줌
V8 자바스크립트 엔진
- js 엔진의 필요성이 대두되면서, 2008년 구글의 V8 자바스크립트 엔진 등장
- js는 데스크톱 애플리케이션과 유사한 ux를 제공할 수 있는 웹 애플리케이션 프로그래밍 언어로 정착하게 됨.
- 덕분에, 과거 웹 서버에서 수행되던 로직들이 대거 클라이언트(브라우저)로 이동하며, 웹 애플리케이션 개발에서 프론트엔드 영억이 주목받는 계기로 작용
Node.js
- 2009년, 구글 V8 자바스크립트 엔진으로 빌드된 자바스크립트 런타임 환경
- 브라우저의 자바스크립트 엔진에서만 동작하던 js를 브라우저 이외의 환경에서도 동작할 수 있도록 자바스크립트 엔진을 브라우저에서 독립시킨 js 실행 환경이다.
- node.js는 다양한 플랫폼에 적용할 수 있지만 서버 사이드 애플리케이션 개발에 주로 사용되며, 빌트인 api를 제공한다.
- js를 사용해 개발하기 때문에, 프론트/백앤드가 모두 js를 사용한다는 동형성은 별도의 언어를 학습하기 위한 시간을 덜 수 있다.
- 비동기 I/O를 지원하며, 단일 스레드 이벤트 루프 기반으로 동작함으로써 요청 처리 성능이 좋다.
- 따라서 데이터를 실시간으로 처리하기 위해 I/O가 빈번하게 사용되는 SPA에 적합하다.
- but cpu 사용률이 높은 애플리케이션에는 권장 X
- node.js의 등장으로 js는 브라우저를 벗어나 서버 사이드 개발에서도 사용할 수 있는 범용 프로그래밍 언어가 됨.
- 현재 js는 크로스 플랫폼을 위한 가장 중요한 언어로 주목받고 있음.
SPA 프레임워크
- 모던 웹 애플리케이션의 개발 규모,복잡도가 상승하며, 변경에 유연하면서 확장하기 쉬운 프레임워크가 등장.
- 이러한 요구에 CBD(Component Based Development) 방법론을 기반으로 하는 SPA(Single Page Application)이 대중화되면서 Angular, React, Vue.js와 같은 다양한 SPA 프레임웤/라이브러리가 등장함.
자바스크립트와 ECMAScript
- ECMAScript : js의 표준 사양인 ECMA-262를 말하며, 프로그래밍 언어의 값, 타입, 객체와 프로퍼티, 함수, 표준 빌트인 객체 등 핵심 문법을 규정한다.
- 각 브라우저 제조사는 ECMAScript 사양을 준수해서 브라우저에 내장되는 js 엔진을 구현한다.
자바스크립트의 특징
- html, css 와 함께 웹을 구성하는 요소 중 하나로 웹 브라우저에서 동작하는 유일한 프로그래밍 언어
- 개발자가 별도의 컴파일 작업을 수행하지 않는 인터프리터 언어
- 대부분의 모던 자바스크립트 엔진은 인터프리터와 컴파일러의 장점을 결합해 비교적 처리 속도가 느린 인터프리터의 단점 해결
- 인터프리터는 소스코드를 즉시 실행하고, 컴파일러는 빠르게 동작하는 머신 코드를 생성하고 이를 최적화
- 이를 통해 컴파일 단계에서 추가적인 시간이 필요함에도 더욱 빠르게 코드를 실행할 수 있다.
- 모던 브라우저에서 사용되는 인터프리터는 전통적인 컴파일러 언어처럼 명시적인 컴파일 단계를 거치지는 않지만 복잡한 과정을 거치며, 일부 소스코드를 컴파일하고 실행한다.
- 이를 통해 인터프리터 언어의 장점인 동적 기능 지원을 살리면서 실행 속도가 느리다는 단점을 극복
- 따라서 현재, 컴파일러와 인터프리터의 기술적 구분이 점차 모호해짐
- but js는 런타임에 컴파일되며 실행 파일이 생성되지 않고, 잉ㄴ터프리터의 도움 없이 실행할 수 없기 때문에 컴파일러 언어라고 할 수는 없다.
- 명령형, 함수형, 프르토타입 기반 객체지향 프로그래밍을 지원하는 멀티 패러다임 프로그래밍 언어
- 클래스 기반 객체지향 언어보다 효율적이면서 강력한 프로토타입 기반의 객체지향 언어이다.
ES6 브라우저 지원 현황
- 인터넷 익스플로러를 제외한 대부분의 모던 브라우저는 ES6를 지원하지만, 100%는 아니다.
- 따라서 브라우저에서 아직 지원하지 않는 최신 기능을 사용하거나 인터넷 익스플로러나 구형 브라우저를 고려해야하는 상황이라면 바벨과 같은 트랜스파일러를 사용해 ES6이상으로 구현한 소스코드를 ES5 이하의 사양으로 다운그레이드해야 한다.
