동기(Synchronous)와 비동기(Asynchronous)는 프로그래밍에서 코드의 실행 방식을 나타내는 두 가지 접근 방식이다. 이 두 용어는 주로 프로그램의 동작 방식과 관련하여 사용된다. 웹 개발에서는 주로 네트워크를 통해 서버에 접속하거나 데이터를 가져올 때 이 방식들을 다룬다.
동기
동기란 각 참여자가 즉시 메시지를 수신하는 실시간 통신을 말한다. 사람으로 예를 들면 전화 통화를 할 때, 상대방에게 즉시 응답할 수 있다. 이를 동기적이라고 한다.
일반적으로 많은 프로그래밍 명령어도 동기식이다. 예를 들어, 함수 내부에서 구문이 끝날 때, 즉시 결과를 반환한다. 순차적으로 한 줄씩 위에서 아래로 실행되는 기본적인 방식이다.
동기적인 코드 실행은 코드의 결과가 예측 가능하고, 순차적인 처리가 필요한 경우에 사용한다.
console.log("1");
console.log("2");
console.log("3");
// 출력 결과: 1, 2, 3 (순서대로 출력)비동기(Asynchronous)
비동기적인 코드 실행은 코드의 실행 순서와 상관없이 특정 작업이 완료되는 것을 기다리지 않고 다음 코드가 실행되는 방식을 의미한다. 비동기는 시간이 오래 걸리는 작업 혹은 외부 리소스와의 통신 등에 해당된다. 비동기 코드는 콜백 함수, Promise, async / await 등의 메커니즘을 사용하여 비동기 작업의 완료를 처리하고, 다음 코드 실행을 보장하기 위해 사용된다.
console.log("1");
setTimeout(() => {
console.log("2");
}, 1000);
console.log("3");
// 출력 결과: 1, 3, 2 (1, 2가 먼저 출력되고 1초 뒤에 3이 출력)
비동기 코드에서 setTimeout() 함수를 사용하여 1초 후에 콜백 함수가 실행되도록 설정했다. 이로 인해 console.log("2")는 1초 뒤에 출력되고, 동기적인 console.log("3"); 이 먼저 출력된다.
비동기 코드는 주로 시간이 걸리는 작업이나 외부 리소스와의 통신, 파일 입출력 등에서 사용되며, 비동기 작업을 통해 프로그램의 반응성과 효율성을 높일 수 있다.
이러한 동기, 비동기 작업은 웹사이트를 개발할 때 프론트엔드 백엔드 모두 기본적으로 중요한 비즈니스 로직이다. 다음 포스트에서 이를 상세하게 다뤄보자.
