[WEB] Javascript 동작 원리

자바스크립트 엔진 동작 원리

Memory Heap 

- 변수의 값이 저장되어있는 공간

Call Stack

- 명령어를 처리하는 공간 (스크립트 엔진은 call stack이 하나뿐이라 아래부터 위로 stack처럼 쌓임, 제일 처음 등록된 업무를 끝마치면 그 다음에 업무가 수행되는식으로 순차적으로 동작)

 

Web APIs

- 브라우저가 처리해주는 업무

1) DOM (html, css를 읽어서 브라우저가 동일한 형태로 화면에 출력)

2) AJAX (실시간으로 외부의 데이터를 불러오거나, 서버의 데이터 불러와서 화면에 뿌려주는 비동기 서버통신)

3) Timeout (일정시간동안 코드를 지연시켰다가 실행해줌)

 

• 동기방식

- 업무의 순서가 정해져있음

• 비동기방식

-업무의 순서는 정해져있지만 언제 어떤 업무가 먼저 끝나는지는 모름.

 

ex) 청소, 빨래, 설거지를 해야한다고 가정했을떄, 예전같으면 바닥청소가 끝나면 빨래를 시작, 빨래가 끝나면 설거지를 시작하는거처럼 순차적으로 일이 진행될수있지만 (동기방식), 요즘에는 로봇 청소기가 있고, 세탁기가있으므로 바닥청소를 하고싶다면 로봇청소기 버튼을 누르고 바로 세탁을 하러간다. (비동기방식) 순서는 정해져있지만 어떤게 먼저 끝날지 모름.

 

스크립트 엔진 또한 비동기방식! (업무에 종류에 따라 WEB API가 업무를 분담해서 하므로)