JavaScript에서 비동기 처리하기

1. 동기와 비동기
: 동기 프로그래밍에서 작업은 차례로 실행되며 작업이 완료될 때까지 중단할 수 없음

: 비동기는 임의의 순서로 또는 동시에 작업이 실행 될 수 있다.  

 

2. JS에서 비동기처리하는 방법
: 런타임에서 싱글 스레드로 동작한다.  그 말은 한 번에 하나의 작업만 처리할 수 있다는 뜻이다. 
: 그러나 프로미스 ,콜백 , Async Await 등의 방법을 사용하면 자바스크립트에서도 비동기 처리를 할 수 있다.

 

3. 콜백 

: 함수의 파라미터로 함수를 전달하며, 비동기 처리가 끝났을 때 전달된 함수를 실행한다.

: 가독성이 좋지 못하여 유지보수나 디버깅때 어려움이 있는 것이 특징이다. (콜백 지옥이라고도 함)

: 카페에가서 점원에게 커피를 주문 하고 다른 것을 하고 있으면, 커피 제조가 끝난 후에 손님을 호출하는 상황을 예시로 들 수 있다.

 

4. 프로미스

: Promise 객체를 사용하며 콜백 대신 사용할 수 있는 방법으로 비동기 작업이 완료되면 결과를 반환하는 객체다.

: 프로미스 객체는 상태를 가지고 있으며 처음에는 대기였다가 작업이 만료 되었을 때 성공 또는 실패 상태가 된다.

: 그 후 then() , catch() 메서드를 사용하여 성공과 실패에 대한 처리를 할 수 있다.

: 약속은 이행, 불이행, 대기 3 가지의 상태를 가질 수 있다.

: 이 코드는 미래의 어느 시점에 실행할거야 라고 약속하는 객체로 Promise를 사용한다.

: Promise 객체가 생성되면 대기 상태가 된다. resolve() 함수가 실행되면 이행으로 변경되고, 실패해 reject() 함수가 실행되면 거절로 변경된다.

: Promise 객체에서만 then()을 사용할 수 있다.

 

5. Async Await 

: 프로미스를 사용하는 비동기 작업을 동기적으로 처리하는 것처럼 코드를 작성할 수 있게 해준다.

: async가 붙어 있는 함수를 실행 할 때 await 키워드를 사용하여 비동기 작업이 완료될 때까지 기다릴 수 있다.

 

6. Promise.all

: 동시에 여러 Promise 객체를 호출하고 싶을 때 Promise.all을 사용한다.

 

7. Promise의 문제점

: 콜백보다는 좋지만 then()과 catch()를 사용하는 체이닝 방식을 사용하기 때문에 가독성 측면에서는 썩 좋은 점수를 주지 못함

 

8. async await 구문

: 가장 최근에 도입된 비동기 처리 방식.

: asnychronous 라는 의미고 async가 붙은 함수는 프로미스를 반환하다고 볼 수 있다.

: await는 기다린다라는 의미. 성공 또는 실패로 Promise 객체의 실행이 완료 되기를 기다린다.