동기 | 비동기 | |
---|---|---|
실행 | 순차적 | 동시적 |
이전 작업이 완료될 때까지 다음 작업이 실행되지 않음 | 작업의 완료 여부를 기다리지 않고 다음 작업이 실행됨 | |
코드의 흐름 | 직렬적 | 병렬적 |
장점 | 간단하고 직관적 | 성능 향상 |
단점 | 시스템의 성능과 응답성 저하 | 코드의 복잡성과 디버깅의 어려움이 증가 |
적용 | 작업 간의 의존성과 순서가 중요한 경우 | I/O 작업이나 네트워크 요청과 같이 시간이 오래 걸리는 작업 |
종류 | 콜백(Callback) 함수, 프로미스(Promise), 비동기 함수(Async/Await) |
함수의 인자로 다른 함수를 전달하고, 비동기 작업이 완료되면 해당 콜백 함수가 호출됩니다.
콜백 함수는 결과 처리를 위해 작성되며, 보통 첫 번째 매개 변수로 에러 정보를 받고, 두 번째 매개 변수부터는 성공적인 결과 데이터를 받습니다.
콜백 함수는 작업을 순차적으로 처리하는 방식으로 코드가 복잡해지고 콜백 지옥(Callback Hell)이 발생할 수 있습니다.
프로미스는 ES6부터 도입된 객체입니다.
프로미스는 대기(pending), 이행(fulfilled), 거부(rejected) 세 가지 상태를 가집니다.
비동기 작업이 완료되면 프로미스는 이행 또는 거부 상태가 되고, 해당 상태에 따라 처리할 수 있는 메서드(then(), catch(), finally())를 제공합니다.
resolve가 호출되면 then이 실행
reject가 호출되면 catch가 실행
콜백 작업을 마치고 무조건 실행되는 finally(생략가능)
프로미스는 콜백 함수를 연속적으로 체인으로 연결하는 콜백 지옥을 피할 수 있도록 하며, 비동기 코드를 보다 구조화하고 가독성 있게 만들어줍니다.
ES8부터 도입된 문법입니다.
프로미스(Promise)를 기반으로 한 비동기 코드를 동기적으로 작성할 수 있게 해줍니다.
Async 함수는 비동기 함수를 선언하기 위한 키워드로, 함수 앞에 사용됩니다. Async 함수는 암묵적으로 프로미스를 반환합니다.
Await 키워드는 Async 함수 내에서만 사용될 수 있습니다. 프로미스의 완료를 기다리는 동안 함수의 실행을 일시 중지하고, 프로미스의 결과를 반환합니다.