9)JavaScript_Callback, 동기처리, 비동기처리

---

콜백

 

 

hoisting이 된 이후부터 코드가 우리가 작성한 순서에 맞춰서 하나하나 동기적으로 실행된다는것

 

hoisting?? : var, function 선언등이 자동적으로 가장 위로 올라가는것을 말함.

 

호이스팅이 이뤄진 순서대로 자동적으로 나타내진다

---

 

비동기를 설명하기에 좋은 예로..

setTimeout() 이라고 브라우져에서 제공하는 API가 있음

지정한 시간이 지날시 지정한 콜백함수를 실행하는 녀석임

밀리세컨드 단위라 1000면 1초를 의미하며

 

저거 읽으면..

1뽑고~

셋탐아웃() 1초 뒤에 2뽑으라네?

3뽑고~

1초됬다 2뽑고 끝내자!

 

자자 콜백 함수 정리 끝. .

콜 했는데 저 setTimeout() 안에 1초뒤 백해달라함

그래서 1초 뒤에 콜백함수가 실행된다

---

Synchronous callback

동기적 콜백

즉시실행되는

왜 이렇게 된건가..?

 

함수의 선언은  hoisting된다 했음

때문에 

자그럼 순서를 보자

1뽑

1초뒤 2뽑~

3뽑~

Hola~뽑~

2뽑~

---

Asynchronous callback

비동기 콜백

콜한뒤 조건 충족 후 백

다시 한번 더 읽어 보자

먼저 선언한 함수들은 전부 호이스팅되서 위로 올라간다

이 순서대로 뽑아 올거고. .

1 출력 (동기)

2 1초대기 (비동기)

3출력 (동기)

4 호이스팅된 함수 위에있지? 출력 (동기)

5 호이스팅된 함수 근데 2초뒤에 출력 (비동기)

---

Hell of callback

실제 백단이랑 통신이 대충 이런식이긴 한데

그래 한번 예를 들어 진행 해보자..

전형적인 콜백 체인이다

받아와 전달하고

또 뭘 전달한거 받아와 전달하고

전달하고 전달하는 그런 체인같은. . .

 

가독성 떨어짐

지저분함

이게 뭔 역활을 하는 함수인지 한눈에 알아볼수가 없음

로그인한다음(loginUser())

그걸바탕으로 사용자 규칙(getRoles())

받아오는..것 까진 오케이

겨우 2개긴 해도 만약 이게

콜백 체인이 한 5개 된다 치면

코드 돌다 뻑나게될시 어디서 뻑난건지 못찾는다

 

다음장에 연결. .