(JS)동기와 비동기

- 자바스크립트는 동기적으로 동작한다.

- 자바스크립트는 비동기 작업도 가능하다.

-우리의 운영체제에게 프로세스라고 하는 작업 영역을 할당 받아 어떠한 동작을 수행한다. 코드의 실행, 프로그램의 실행, 파일 다운로드 등이 모두 프로세스별로 할당이 된다. 그리고 각 프로세스 내부에는 할당 받은 업무를 처리할 스레드가 존재한다. 스레드가 여러개라면, 하나의 프로세스 내에서 여러개의 작업을 동시에 수행할 수 있다.

-스레드가 여러개 있는 작업 환경을 멀티 스레드라고 한다. 다양한 작업을 동시간 대에 시작할 수 있다.

-그리고 스레드가 각 프로세스별로 하나씩만 존재하는 경우가 있다. 이런 환경을 싱글 스레드라고 한다. 자바스크립트는 싱글 스레드 기반의 언어이다. 때문에 자바스크립트는 동기적으로 동작한다.

- stack과 queue

• call stack : 기본적인 함수들은 모두 call stack에 쌓인다. call stack에 쌓인 기본 함수들은 먼저 담긴 함수들이 위에 쌓인 함수들의 종료를 기다린다.
• callback queue : 비동기 함수(Web APIs 포함)들은 모두 callback queue에 쌓인다. callback queue에 쌓인 비동기 함수들은 call stack이 비워져 있다면, 그 때 call stack으로 하나씩 옮겨진다.

setTimeout(() => {
	console.log("setTimeout call")
})

const func3 = function() {
	console.log("func3 call")
}

const func2 = function() {
	func3()
	console.log("func2 call")
}

const func1 = function() {
	func2()
	console.log("func1 call")
}

func1()

-결과
func3 call
func2 call
func1 call
setTimeout call

-call stack 영역에 쌓인 함수는 LIFO 방식으로 수행되기 때문에 func3, func2, func1 순서로 함수가 완수된다. 그리고 해당 함수들이 모두 완료되면 그 후에 callback queue에 담긴 setTimeout 함수가 call stack으로 옮겨져 실행되며 마지막으로 "setTimeout call" 메세지가 출력된다. (SetTimeout 함수는 지연 시간을 지정해주지 않았음에도 불구하고 callback queue 영역으로 옮겨진다. 비동기 함수이기 때문이다.)