thumbnail
2.자바스크립트란
JavaScript
2022.03.09.

제로베이스 네카라쿠배 온라인스쿨 1기 과정(2021. 11 ~ 2021. 12)에서 공부했던 Javascript Deepdive 교재의 내용 요약 및 필자의 생각을 정리한 내용입니다. 원서의 내용 챕터의 일부를 요약한 내용으로 보다 자세한 내용은 원서를 참조 바랍니다.


2장 자바스크립트란?

2.1 자바스크립트의 탄생

  • 1995년 넷스케이프 커뮤니케이션즈에서 웹페이지의 보조적인 기능을 수행하기 위해 브라우저에서 동작하는 경량 프로그래밍 언어를 도입한 것이 자바스크립트다. (브렌던 아이크)
  • 처음에는 모카(1996년 3월)라는 이름으로 시작했다가 라이브스크립트(1996년 9월)로 그리고 다시 자바스크립트라는 이름으로 최종 명명되었다.

2.2 자바스크립트의 표준화

  • 1996년 8월, 마이크로소프트는 ‘JScript’라는 자바스크립트 파생 버전을 익스플로러 3.0에 탑재했다. 하지만 자바스크립트와 JScript가 표준화되지 못하고 적당히 호환되어 문제가 되었다.
  • 크로스 브라우징 이슈가 발생하자, 표준화의 필요성이 제기되고 넷스케이프 측에서는 비영리 표준화 기구인 ECMA 인터내셔널에 자바스크립트의 표준화를 요청한다. 그래서 1997년 표준화된 자바스크립트 초판(ECMAScript 1) 사양이 완성되었고 ECMAScript로 명명되었다.
    • 이후 1999년 ECMAScript 3(ES3), 10년 후인 2009년 ECMAScript5(ES5)는 HTML5와 함께 출현된 표준 사양이다.
    • 2015년 공개된 ECMAScript(ES6)는 let/const 키워드, 화살표 함수, 클래스, 모듈 등과 같이 범용 프로그래밍 언어로서 갖춰야 할 기능들을 대거 도입하는 큰 변화가 있었다.

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

  • 초창기 자바스크립트는 보조적인 기능을 수행하기 위한 한정적인 용도로 제작되었기 때문에 HTML, CSS를 단순히 렌더링 하는 수준이었다.

2.3.1 Ajax

  • 1999년 자바스크립트를 이용해 서버와 브라우저가 비동기 방식으로 데이터를 교환할 수 있는 통신 기능인 Ajax(Asynchronous JavaScript and XML)가 XMLHttpRequest라는 이름으로 등장했다.
  • 이전의 웹페이지는 완전한 HTML 코드를 서버로부터 전송받아 웹페이지 전체를 렌더링하는 방식이었기 때문에, 화면이 전환되면 웹페이지 전체를 처음부터 다시 렌더링해야 했다.
  • Ajax의 등장으로 인해 웹페이지에서 변경할 필요가 없는 부분은 다시 렌더링하지 않고, 서버로부터 필요한 데이터만 전송받아 변경해야 하는 부분만 한정적으로 렌더링하는 방식이 가능해졌다.

2.3.2 jQuery

  • 2006년 jQuery의 등장으로 DOM을 더욱 쉽게 제어할 수 있게 되었고, 크로스 브라우징 이슈도 어느 정도 해결되었다.

2.3.3 V8 자바스크립트 엔진

  • 2008년 등장한 v8 자바스크립트 엔진은 구글 맵스로 확인된 웹 애플리케이션 프로그래밍 언어로서의 가능성이 확인되면서, 빠르게 동작하는 엔진의 필요성이 대두되면서 등장했다.
  • v8 엔진의 덕택으로 데스크톱 애플리케이션과 유사한 사용자 경험을 제공할 수 있는 웹 애플리케이션 프로그래밍 언어로 정착하게 되었다.

2.3.4 Node.js

  • 2009년 라이언 달이 발표한 Node.js는 v8 자바스크립트 엔진으로 빌드된 자바스크립트 런타임 환경이다.
  • Node.js는 자바스크립트를 브라우저 이외의 환경에서도 동작할 수 있도록 자바스크립트 엔진을 브라우저에서 독립시킨 자바스크립트 실행 환경이다.
  • 서버 사이드 애플리케이션 개발에 주로 사용되며, 필요한 모듈, 파일 시스템, http등 빌트인 API를 제공한다.
  • Node.js는 자바스크립트 엔진을 기반으로 하므로 프런트엔드와 백엔드 영역에서 자바스크립트를 사용할 수 있고, 이러한 동형성은 학습 시간을 절약해주는 장점이 있다.
  • Node.js는 비동기 I/O를 지원하며 단일 스레드 이벤트 루프 기반으로 동작함으로써 요청 처리 성능이 좋다.

2.3.5 SPA 프레임워크

  • 모던 웹 애플리케이션은 데스크톱 애플리케이션과 비교해도 손색없느 성능과 사용자 경험을 제공하는 것이 필수가 되었고, 더불어 개발 규모와 복잡도도 상승했다.
  • 이에 따라 많은 패턴과 라이브러리가 출현했고, 개발에 많은 동무을 주었지만 변경에 유연하면서 확장하기 쉬운 애플리케이션 아키텍처 구축을 어렵게 했고 필연적으로 프레임워크가 등장하게 되었다.
  • CBD(Component Based Development)방법론을 기반으로 하는 SPA(Single Page Application)가 대중화되면서 Angular, React, Vue.js, Svelte등 다양한 SPA 프레임워크/라이브러리 또한 많은 사용층을 확보하고 있다.

2.4 자바스크립트와 ECMAScript

  • ECMAScript는 자바스크립트의 표준 사양인 ECMA-262를 말하며, 프로그래밍 언어의 값, 타입, 객체와 프로퍼티, 함수, 표준 빌트인 객체 등 핵심 문법을 규정한다.
  • 자바스크립트는 프로그래밍 언어로서 기본 뼈대를 이루는 ECMAScript와 브라우저가 별도 지원하는 클라이언트 사이드 Web API, 즉 DOM, BOM, Canvas, XMLHttpRequest, fetch, requestAnimationFrame, SVG, Web Storage, Web Component, Web Worker 등을 아우르는 개념이다.

2.5 자바스크립트 특징

  • HTML, CSS와 함께 웹을 구성하는 요소로 웹 브라우저에서 동작하는 유일한 프로그래밍 언어다.
  • 개발자가 별도 컴파일 작업을 수행하지 않는 인터프리터 언어다.
    • 인터프리터는 소스코드를 즉시 실행하고 컴파일러는 빠르게 동작하는 머신 코드를 생성하고 최적화한다.
    • 이를 통해 컴파일 단계에서 추가적인 시간이 필요함에도 더욱 빠르게 코드를 실행할 수 있다.
  • 자바스크립트는 명령형, 함수형, 프로토타입 기반 객체지향 프로그래밍을 지원하는 멀티 패러다임 프로그래밍 언어다.
  • 자바스크립트는 클래스 기반 객체지향 언어보다 효율적이면서 강력한 프로토타입 기반 객체지향 언어다.

2.6 ES6 브라우저 지원 현황

  • 익스플로러를 제외한 대부분 모던 브라우저는 ES6를 지원하지만 100% 지원하진 않는다.
  • Node.js는 v4부터 ES6를 지원하기 시작했다.

© 2022 Developer Abel, Powered By Gatsby.