[JS] 자바스크립트 동작원리

 

 

---

너무나도 어려운 자바스크립트 비동기 동작 

 

자바스크립트는 싱글 쓰레드 언어입니다. 이 의미는 쉽게 풀어쓰면 한 번에 한 가지 일 밖에 처리할 수 없다는 것을 의미합니다. (어려운 용어로는 Call stack이 하나라고 표현 합니다)

동기적(쉽게 말하면 순차적,순서대로)으로 동작 -> 스택(쓰레드)이 하나밖에 없기 때문입니다.

 

 그러나 시간이 오래걸리는 실행은 기다리지 않고 다른걸 먼저 실행합니다. 싱글 쓰레드이기 때문에 동기적으로 동작하는데 어떻게 다른걸 먼저 실행할까요??

1분 이상이 시간이 소요되는 오래 걸리는 작업이 있다고 가정 해보겠습니다. 자바스크립트는 머리가 하나이기 때문에, 1분 동안 아무것도 안하고 기다리면 브라우저는 아무런 행동(화면 스크롤, 버튼 클릭…)도 하지 못하게 됩니다. 그렇다면 어떻게 해야할까요? 

이 때 사용하는 것이 바로 비동기 콜백입니다.

 

-동기적 언어지만 비동기처럼 보이는 이유가 여기에 있습니다.

-> (web API, Callback Queue, event loop) 에 의해 비동기 동작이 가능합니다.

(시간 걸려서 baground로 보내지는 것 ex) setTimeout, 서버와 통신, 이벤트 리스너)

 

예시)

서버와 통신할때는 어떤 절차로 이루어질까요?

 

1. url 준비

2. 헤더준비

3. 서버에 요청 -> 여기서 데이터를 받아오기까지 시간이 걸리므로 background로 보냄 

but, 다음을 실행하려고 보니 데이터를 보여주려면 데이터를 받아올때까지 기다려야함 

이때 데이터를 받아올때까지 기다리게 하는게 async(비동기라는 뜻) await

->동기적인 자바스크립트를 비동기적으로 처리하기 위해 쓴다

4. 데이터를 보여줌

 

 

 

참고자료

https://tristy.tistory.com/51

[JavaScript] JavaScript 파헤치기 - 동작 원리

 

 

---