내머리속 JS 🙈는...
막연히 알고 이해하기만 했던 지식을 정리하여 확실히 짚고 넘어가기 위해
간결하게 정리한 개인 요약집입니다. ( 잊지마 내머리 🙈)
다른 사람에게 설명할 때, 정확한 내용을 전달해줄 수 있을 정도로 알고 있자..!
Hello, Javascript 🙂
What is Javascript?? 🧐
객체 기반 스크립트 언어, 웹브라우저에서 동작하는언어
≒ 웹페이지(정적인 HTML, CSS)를 동적으로 제어하기 위해서 고안된 언어
- 웹페이지 스크립팅
- DOM (Document Object Model)
- 서버 측 스크립팅(웹서버를 동작하게 하는 언어) - node.js
- 브라우저 확장기능
자바스크립트는 크로스 플랫폼을 위한 가장 중요한 언어로 주목받고 있습니다.
자바스크립트는 웹은 물론 모바일 하이브리드 앱(PhoneGap, Ionic), 서버 사이드(NodeJS), 데스크톱(Electron), 머신 러닝(TensorFlow.js), 로보틱스(Johnny-Five) 프로그래밍 언어로도 사용됩니다.
자바스크립트는 일반적으로 프로그래밍 언어로서 기본 뼈대를 이루는 ECMAScript와
브라우저가 별도 지원하는 클라이언트 사이드 Web API
즉 DOM, BOM, Canvas, XMLHttpRequest, Fetch, requestAnimationFrame, SVG, Web Storage, Web Component, Web worker 등을 아우르는 개념입니다.
프로토타입 기반의 객체지향 언어이다.
자바스크립트는 개발자가 별도의 컴파일 작업을 수행하지 않는 인터프리터 언어(Interpreter language)이다.
*인터프리터(interpreter, 문화어: 해석기)는 프로그래밍 언어의 소스 코드를 바로 실행하는 컴퓨터 프로그램 또는 환경
⚔️ 인터프리터 vs 컴파일러 :: 원시코드 기계어로 번역
- 인터프리터: 고급 명령어들을 중간 형태로 번역한 다음 실행
- 컴파일러: 고급 명령어들을 직접 기계어로 번역
자바스크립트는 명령형(imperative), 함수형(functional), 프로토타입 기반(prototype-based) 객체지향 프로그래밍을 지원하는 멀티 패러다임 프로그래밍 언어
(재미로 보는 ... 👀)
🕰 자바스크립트 히스토리
> 1995년
넷스케이프 커뮤니케이션즈 '브렌던 아이크(Brendan Eich)'가 개발
> 1996년 8월
⚔️Javascript vs JScript (NetScape vs Mircrosoft)
JScript와 자바스크립트가 표준화되지 못하고 적당히 호환 > ~크로스 브라우징 현상~
🚨 모든 브라우저에서 동일하게 동작하는 표준화된 자바스크립트에 대한 필요성이 제기 🚨
⇣
> 1997년 7월 [ ECMAScript 탄생 !!! ]
컴퓨터 시스템의 표준을 관리하는 비영리 표준화 기구인 ECMA 인터내셔널
ECMA-262라 불리는 표준화된 자바스크립트 초판(ECMAScript 1)의 명세(specification)가 완성
상표권 문제로 자바스크립트는 ECMAScript로 명명
(브라우저 제조사는 ECMAScript를 준수하여 브라우저에 내장되는 자바스크립트 엔진을 구현)
∴ 프로그래밍 언어의 타입, 값, 객체와 프로퍼티, 함수, 빌트인 객체 등 핵심 문법(core syntax)을 규정 하기 위해 탄생!!!
> 1999년 [ Ajax 등장 !!! ]
자바스크립트를 이용해서 비동기적(Asynchronous)으로 서버와 브라우저가 데이터를 교환할 수 있는 통신 기능인 Ajax(Asynchronous JavaScript and XML)가 XMLHttpRequest이라는 이름으로 등장
Before> 서버로부터 완전한 HTML을 전송 받아 웹 페이지 전체를 렌더링하는 방식
~ [ Ajax 등장!!! ] ~
After > 웹 페이지의 변경이 필요 없는 부분은 다시 렌더링하지 않고, 서버로부터 필요한 데이터만을 전송 받아 변경이 필요한 부분만을 한정적으로 렌더링하는 방식
> 2006년 [ jQuery 등장 !!! ]
jQuery의 등장으로 다소 번거롭고 논란이 있던 DOM(Document Object Model)을 보다 쉽게 제어
> 2008년 [ V8 등장 !!! ]
구글의 * V8 자바스크립트 엔진 빠르게 동작하는 자바스크립트 엔진
과거 웹 서버에서 수행되던 역할들이 클라이언트(브라우저)로 이동 (웹 애플리케이션에서 프론트앤드 영역이 주목받는 계기)
구글의 Chrome V8 자바스크립트 엔진으로 빌드된 자바스크립트 런타임 환경(Runtime Environment)인 *Node.js
> 2009년 [ Node.js 등장 !!! ]
브라우저에서만 동작하던 자바스크립트를 브라우저 이외의 환경에서 동작시킬 수 있는 자바스크립트 실행 환경인 Node.js의 등장
- 서버 사이드 애플리케이션 개발에서도 사용
> 2015년
ECMAScript 6(ECMAScript 2015)가 공개되었고 범용 프로그래밍 언어로서 갖추어야 할 let/const 키워드, 화살표 함수, 클래스, 모듈 등과 같은 기능들을 대거 도입
자바스크립트 친구들 👻
ECMAScript
프로그래밍 언어의 타입, 값, 객체와 프로퍼티, 함수, 빌트인 객체 등 핵심 문법(core syntax)을 규정
브라우저 제조사는 ECMAScript를 준수하여 브라우저에 내장되는 자바스크립트 엔진을 구현
클라이언트 사이드 Web API는 ECMAScript와는 별도로 World Wide Web Consortium (W3C)에서 별도의 명세로 관리
ES6
Internet Explorer나 구형 브라우저는 ES6를 대부분 지원하지 않는다.
따라서 Internet Explorer나 구형 브라우저를 고려해야 하는 상황이라면 babel과 같은 트랜스파일러를 사용하여 ES6로 구현한 소스코드를 ES5 이하의 버전으로 다운그레이드할 필요
Node.js
2009년 라이언 달(Ryan Dahl)이 발표한 Node.js는 Chrome V8 자바스크립트 엔진으로 빌드된 자바스크립트 런타임 환경(Runtime Environment)
자바스크립트를 브라우저 이외의 환경에서 동작시킬 수 있는 자바스크립트 실행 환경
주로 서버 사이드 애플리케이션 개발에 사용되며 이에 필요한 모듈, 파일 시스템, HTTP 등 빌트인 API를 제공
npm
npm(node package manager)은 자바스크립트 패키지 매니저이다.
Node.js에서 사용할 수 있는 모듈들을 패키지화하여 모아둔 저장소 역할과 패키지 설치 및 관리를 위한 CLI(Command line interface)를 제공
