[javascript] 비동기 프로그래밍의 디자인 패턴

14 Dec 2023

javascript

오늘날 대부분의 웹 애플리케이션은 사용자 경험을 향상시키기 위해 비동기 프로그래밍을 사용합니다. 비동기 프로그래밍을 효율적으로 다루기 위해 다양한 디자인 패턴을 사용할 수 있습니다. 이번 글에서는 주요한 비동기 프로그래밍 디자인 패턴 몇 가지에 대해 알아보겠습니다.

콜백 패턴

가장 기본적인 비동기 프로그래밍 패턴이자, 가장 오래된 패턴 중 하나입니다. 함수를 호출한 이후에 비동기 작업이 완료되면 콜백 함수가 호출됩니다.

예시:

function fetchData(callback) {
  // 비동기 작업
  setTimeout(function() {
    callback('Data');
  }, 1000);
}

fetchData(function(data) {
  console.log(data);
});

프로미스 패턴

콜백 패턴의 단점을 보완한 패턴으로, 비동기 작업의 완료 또는 실패를 나타내는 객체입니다.

예시:

function fetchData() {
  return new Promise(function(resolve, reject) {
    // 비동기 작업
    setTimeout(function() {
      resolve('Data');
    }, 1000);
  });
}

fetchData()
  .then(function(data) {
    console.log(data);
  })
  .catch(function(error) {
    console.error(error);
  });

async/await 패턴

프로미스 패턴을 더욱 간결하게 사용할 수 있도록 하는 ES2017의 문법입니다. async 함수 내에서 await 키워드를 사용하여 프로미스의 완료를 기다릴 수 있습니다.

예시:

async function fetchData() {
  return new Promise(function(resolve) {
    // 비동기 작업
    setTimeout(function() {
      resolve('Data');
    }, 1000);
  });
}

async function main() {
  try {
    const data = await fetchData();
    console.log(data);
  } catch (error) {
    console.error(error);
  }
}

main();

마치며

비동기 프로그래밍을 위한 디자인 패턴은 애플리케이션의 성능을 향상하고 유지보수성을 높일 수 있는 중요한 요소입니다. 적절한 패턴을 선택하여 비동기 작업을 다루는 것이 중요합니다.

참고 자료

이상으로 비동기 프로그래밍의 디자인 패턴에 대해 알아보았습니다. 감사합니다.

목차

콜백 패턴

프로미스 패턴

async/await 패턴

마치며

참고 자료