포스트

비동기 호출에서 응답을 반환하는 방법

비동기란 무엇인가?

비동기(asynchronous)는 작업이 동시에 실행되지 않고, 각 작업이 독립적으로 수행되는 것을 의미합니다. 비동기 호출은 특히 웹 개발에서 자주 사용되며, 서버로부터 데이터를 받아오거나 다른 작업을 수행할 때 유용합니다.

비동기 호출에서 반환값 얻기

비동기 함수는 작업을 즉시 완료하지 않습니다. 그래서 함수의 반환값을 바로 얻을 수 없습니다. 대신 콜백 함수, 프로미스(Promise), async/await 등의 방법을 사용합니다.

콜백 함수 사용

콜백 함수는 다른 함수에 인수로 전달되어, 특정 이벤트가 발생한 후 실행됩니다.

1
2
3
4
5
6
7
8
9
10
function getData(callback) {
  setTimeout(() => {
    const data = "Hello, world!";
    callback(data);
  }, 1000);
}

getData((response) => {
  console.log(response);
});

프로미스 사용

프로미스는 비동기 작업이 성공하거나 실패할 때 값을 반환합니다.

1
2
3
4
5
6
7
8
9
10
11
12
function getData() {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      const data = "Hello, world!";
      resolve(data);
    }, 1000);
  });
}

getData().then((response) => {
  console.log(response);
});

async/await 사용

async/await는 비동기 코드를 동기식으로 작성할 수 있게 합니다.

1
2
3
4
5
6
7
8
async function getData() {
  const response = await fetch("https://api.example.com/data");
  const data = await response.json();
  return data;
}

const result = await getData();
console.log(result);

요약

비동기 호출에서 반환값을 얻기 위해서는 콜백 함수, 프로미스, async/await 중 하나를 사용할 수 있습니다. 이러한 방법들은 웹 개발에서 서버와 통신할 때 매우 중요한 역할을 합니다.

이 기사는 저작권자의 CC BY 4.0 라이센스를 따릅니다.