모던 자바스크립트 딥다이브 2장 정리

크로스 브라우징 : 브라우저에 따라 웹페이지가 정상적으로 작동하지 않는 것

 

 

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

 

Ajax 

• 자바스크립트를 이용해 서버와 브라우저가 비동기 방식으로 데이터 교환해 웹 페이지를 동적으로 갱신하는 프로그래밍 방식.
• 이로 인해 서버로부터 필요한 데이터만 전송받아 변경해야 하는부분만 한정적으로 받아 렌더링 할 수 있게 됨
• 전체 HTML 코드를 받아오는 불필요한 데이터 통신과 렌더링 과정이 사라짐. 또한, 전체 페이지를 받아와 전체적으로 화면이 전환되면서 깜빡거리는 현상을 어느정도 방지할 수 있게 됨
• 브라우저에서 제공하는 Web API인 XMLHttpRequest 객체를 기반으로 동작
• 비동기 방식으로 동작하기 때문에 서버에게 요청을 보낸 이후 블로킹 발생하지 않음

 

jQuery : jQuery 등장으로 크로스 브라우징 이슈도 어느 정도 해결할 수 있고 더 간단하게 DOM을 다룰 수 있게 됨

(모든 브라우저 지원하고 있음 대부분의 크로스 브라우징 이슈를 해결 할 수 있음)

 

구글 v8 자바스크립트 엔진 : 자바스크립트로 웹 어플리케이션을 개발 할 수 있게 됨. 과거 웹 서버에서 수행되던 로직들이 브라우저에서도 가능하게 됨

 

Node.js : 구글 v8 자바스크립트 엔진으로 빌드된 자바스크립트 런타임 환경. 브라우저의 자바스크립트 엔진에서만 동작하던 자바스크립트를 브라우저 이외의 환경에서도 동작할 수 있도록 자바스크립트 엔진을 브라우저에서 독립시킨 자바스크립트 실행 환경. 비동기 I/O를 지원하고 단일 스레드 이벤트 루프 기반으로 동작함 따라서 데이터를 실시간으로 처리하기 위해 I/O가 빈번하게 발생하는 SPA 개발에 적합함. Node.js의 등장으로 서버 사이드 애플리케이션 개발에서 사용가능한 범용 프로그래밍 언어가 됨.

 

ECMAScript : 크로스 브라우징 이슈와 자바스크립트 파편화를 방지하기 위해 완성된 자바스크립트 표준 사양( ECMA-262.) 프로그래밍 언어의 값, 타입, 객체와 프로퍼티, 함수, 표준 빌트인 객체 등 핵심 문법을 규정함. ES6 버전에 범용 프로그래밍 언어로서 갖춰야 할 기능들이 대거 도입되는 큰 변화가 있었음(let/const 키워드, arrow function, 클래스, 모듈 등)

 

ES6 특징

• block-level scope를 가지는 let과 const 지원 (이전에 존재하던 var는 function-level scope)
• Arrow function(화살표 함수)로 익명함수 표현 가능
• 템플릿 문자열 '${문자열}'로 간단하게 문자열 처리 가능
• 클래스 추가
• 모듈 기능 import, export 키워드 추가
• map & set 자료구조 추가
• spread operator 추가
• for of 추가 (이전에는 for, for in만 존재)

 

자바스크립트 : 프로그래밍 언어로서 ECMAScript와 브라우저가 별도 지원하는 클라이언트 사이드 Web API 등을 아우르는 개념이다.

 

자바스크립트의 특징

• 웹 브라우저에서 동작하는 유일한 프로그래밍 언어
• 인터프리터 언어
• 명령형, 함수형, 프로토타입 기반 객체지향 프로그래밍을 지원하는 멀티 패러다임 프로그래밍 언어

CBD 방법론 (Component Based Development)

• CBD 방법론을 하는게 SPA
• 독립적인 컴포넌트를 결합해서 하나의 애플리케이션을 구성하는 방법론