본문 바로가기

뉴스

비동기(Asynchronous)와 동기(Synchronous)의 차이점

동기 vs 비동기

 

동기(Synchronous)

동기 방식은 작업을 순차적으로 실행하는 방식입니다.

한 작업이 완료될 때까지 다음 작업은 대기하며, 이는 직렬적인 처리 방식을 의미합니다.

동기 방식의 특징

1. 작업의 실행 순서가 명확합니다.
2. 한 작업이 끝나야 다음 작업을 시작합니다.
3. 코드의 실행 흐름이 예측 가능합니다.


비동기(Asynchronous)

비동기 방식은 작업의 완료 여부와 관계없이 다음 작업을 실행할 수 있는 방식입니다.

비동기 방식의 특징

여러 작업을 동시에 처리할 수 있습니다.
작업의 완료 순서가 보장되지 않습니다.
긴 작업 시간이 필요한 태스크를 효율적으로 처리할 수 있습니다.

 

 

 

 

JavaScript에서의 Promise

Promise는 JavaScript에서 비동기 처리를 위한 객체입니다.

Promise의 주요 역할과 특징


1. 비동기 작업의 상태 관리: Promise는 비동기 작업의 성공(fulfilled) 또는 실패(rejected) 상태를 관리합니다.
2. 코드의 가독성 향상: 콜백 지옥(Callback Hell)을 피하고 비동기 코드를 더 깔끔하게 작성할 수 있게 해줍니다.
3. 에러 처리 개선: 비동기 작업의 에러를 더 효과적으로 처리할 수 있습니다.
4. 비동기 작업의 연결: 여러 비동기 작업을 연속적으로 처리할 수 있게 해줍니다.

Promise 객체 예제

const promise = new Promise((resolve, reject) => {
  // 비동기 작업 수행
  if (/* 작업 성공 */) {
    resolve('결과');
  } else {
    reject('에러');
  }
});

 

 

1. Promise는 .then(), .catch(), .finally() 메서드를 통해 비동기 작업의 결과를 처리할 수 있습니다

2. Promise는 비동기 프로그래밍을 더 쉽고 효율적으로 만들어주지만...

3. 복잡한 비동기 로직에서는 여전히 코드가 복잡해질 수 있습니다. 이를 해결하기 위해 async/await 문법이 도입되었으며, 이는 Promise를 기반으로 동작하면서 더 직관적인 비동기 코드 작성을 가능하게 합니다.

 

 

 

 

 

Promise와 async/await의 주요 장단점

Promise의 장단점

장점

1. 비동기 작업의 상태(대기, 성공, 실패)를 명확히 관리할 수 있습니다.
2. .then(), .catch(), .finally() 메서드를 통해 체인 형태로 비동기 작업을 연결할 수 있습니다.
3. 여러 비동기 작업을 병렬로 처리할 수 있는 Promise.all() 같은 메서드를 제공합니다.

 

단점

1. 복잡한 비동기 로직에서는 .then() 체인이 길어져 가독성이 떨어질 수 있습니다.
2. 에러 처리를 위해 각 .then() 블록마다 .catch()를 사용해야 할 수 있어 코드가 복잡해질 수 있습니다.

 


async/await의 장단점

장점
1. 동기 코드와 유사한 구조로 작성되어 가독성이 뛰어납니다.
2. try-catch 문을 사용해 에러 처리를 더 직관적으로 할 수 있습니다.
3. 디버깅 시 정확한 에러 위치를 파악하기 쉽습니다.
4. 코드가 간결해지고 직관적인 변수 사용이 가능합니다.


단점
1. 함수에 async 키워드를 붙여야 하므로, 기존 코드를 수정해야 할 수 있습니다.
2. 병렬 처리를 위해서는 추가적인 작업(Promise.all() 등과 함께 사용)이 필요할 수 있습니다.

 

비교 요약

1. 가독성: async/await이 더 우수합니다. 특히 복잡한 비동기 로직에서 큰 차이를 보입니다.
2. 에러 처리: async/await이 try-catch를 사용하여 더 직관적이고 효율적입니다.
3. 디버깅: async/await이 에러 위치를 더 정확히 파악할 수 있어 유리합니다.
4. 유연성: Promise가 더 유연한 편입니다. 다양한 상황에 대응하기 쉽습니다.
5. 성능: 둘 사이에 큰 차이는 없습니다. async/await도 내부적으로 Promise를 사용합니다.