동시성은 현대 소프트웨어 개발에서 중요한 개념입니다. 애플리케이션의 성능과 반응성을 향상시키기 위해, 비동기 작업을 동시에 처리하는 것이 필요합니다. Promise와 async/await는 JavaScript에서 동시성을 관리하는 데 도움이 되는 강력한 패턴과 도구입니다.

Promise

Promise는 비동기 작업의 성공 또는 실패를 나타내는 객체입니다. Promise 객체는 resolve와 reject 두 개의 함수를 인자로 받는 생성자를 호출하여 생성됩니다. resolve 함수는 작업이 성공적으로 완료되었음을 알리고, reject 함수는 작업의 실패를 알립니다.

const promise = new Promise((resolve, reject) => {
  // 비동기 작업 수행
  if (/* 성공 조건 */) {
    resolve('성공');
  } else {
    reject('실패');
  }
});

promise.then(result => {
  // 작업이 성공적으로 완료된 경우 실행되는 콜백 함수
}).catch(error => {
  // 작업이 실패한 경우 실행되는 콜백 함수
});

Promise 객체는 .then() 메서드를 통해 성공 콜백 함수와, .catch() 메서드를 통해 실패 콜백 함수를 등록할 수 있습니다. 이를 통해 비동기 작업의 결과를 처리할 수 있습니다.

async/await

async/await은 Promise를 좀 더 간편하게 다룰 수 있는 구문적 설탕입니다. async 키워드를 함수 앞에 붙이면, 해당 함수는 항상 Promise를 반환합니다. await 키워드는 Promise가 성공하거나 실패할 때까지 함수의 실행을 일시 중단합니다.

async function getData() {
  try {
    const data = await fetch('https://api.example.com/data');
    // 비동기 작업이 완료될 때까지 기다림
    return data;
  } catch (error) {
    console.error(error);
  }
}

getData().then(result => {
  // 비동기 작업의 결과 사용
});

await 키워드를 사용하여 비동기 작업의 완료를 기다리면 코드가 매우 간결해지고 가독성이 향상됩니다.

동시성 관리

Promise와 async/await을 함께 사용하여 동시성을 관리할 수도 있습니다. 여러 비동기 작업을 병렬로 실행하고, 모든 작업이 완료되기를 기다리는 것이 가능합니다.

async function fetchData() {
  const promise1 = fetch('https://api.example.com/data1');
  const promise2 = fetch('https://api.example.com/data2');
  const promise3 = fetch('https://api.example.com/data3');

  const results = await Promise.all([promise1, promise2, promise3]);
  
  return results;
}

fetchData().then(arrayOfResults => {
  // 병렬로 실행된 작업의 결과를 사용
});

Promise.all() 메서드를 사용하여 모든 Promise 객체가 완료될 때까지 기다릴 수 있습니다.

Promise와 async/await은 비동기 작업 관리를 훨씬 쉽고 간편하게 만들어 줍니다. 동시성을 관리하는 것은 애플리케이션의 성능을 향상시키는 데 중요한 역할을 합니다. 이러한 패턴과 도구를 활용하여 효율적인 비동기 코드를 작성해 보세요!

참고 자료: MDN web docs