javascript의 동기와 비동기란

<본 블로그는 gobae 님의 블로그를 참고해서 공부하며 작성하였습니다 :-)>

https://gobae.tistory.com/100

[자바스크립트] 동기와 비동기 이해하기.

 

 

 

🧸 동기 Synchronous

• 순차적/직렬적으로 태스크를 수행
• 요청을 보냈다면, 응답을 받아야 다음 동작이 이루어짐
• 순차적으로 실행되므로, 어떤 작업이 수행중이라면 뒤의 작업은 대기함
• 블로킹(작업 중단)이 발생

 

🧸 비동기 Asynchronous

• 병렬적으로 태스크를 수행
• 현재 작업의 종료여부와 무관하게 다음 작업을 실행
• 그러므로 동기 방식과는 달리 완료 순서가 보장되지 않음
• 블로킹이 발생하지 않음
• 서버와 통신할 때 가장 많은 시간이 소요되므로 네트워크 관련 작업들은 비동기적으로 구현되어 있음

1) 콜백함수 사용

특정함수에 매개변수로 전달된 함수를 의미합니다.즉, 나중에 호출될 함수들

함수의 인자처럼 전달되어서 쓰이는 함수

const print = () => console.log('hi');

setTimeout(print, 2000)

 

2) Promise

세가지 상태(States)

1. Pending(대기) : 비동기 처리 로직이 아직 완료되지 않은 상태
2. Fulfilled(이행) : 비동기 처리 로직이 수행완료되어 결과 값을 반환한 상태
3. Rejected(실패) : 비동기 처리가 실패하거나 에러가 발생한 상태

 

3) Async/Await

async라는 키워드를 붙여 사용해야 하며 선언된 async 함수 안에서만 await 키워드를 사용

async function 함수명() {
  await 비동기_처리_메서드_명();
}