>웹 프론트엔드 >JS 튜토리얼 >jQuery Promises를 사용하여 세 개의 비동기 HTTP 호출을 순차적으로 실행하려면 어떻게 해야 합니까?

jQuery Promises를 사용하여 세 개의 비동기 HTTP 호출을 순차적으로 실행하려면 어떻게 해야 합니까?

Susan Sarandon
Susan Sarandon원래의
2024-10-30 18:03:30470검색

How can I execute three asynchronous HTTP calls sequentially using jQuery Promises?

jQuery Promise로 비동기 호출 연결

JavaScript의 비동기 프로그래밍을 사용하면 사용자 인터페이스를 차단하지 않고 코드를 실행할 수 있습니다. 이를 달성하기 위해 Promise는 종종 데이터 흐름을 관리하고 작업이 특정 순서로 실행되도록 하는 데 사용됩니다.

주어진 시나리오에서는 세 개의 비동기 HTTP 호출을 순서대로 수행하는 것이 목표입니다. 지연된 약속이 있는 두 가지 기능이 포함된 부분 솔루션을 제공했습니다. 이를 세 가지 함수로 확장하기 위해 핵심 개념을 자세히 살펴보겠습니다.

비동기 요청을 시작하는 각 함수에서 $.ajax()가 반환한 jqXHR 개체를 반환합니다. 이러한 jqXHR 객체는 Promise와 호환됩니다. 즉, .then(), .done(), .fail() 또는 .always()를 사용하여 쉽게 연결할 수 있습니다.

이 경우 .then( )은 세 가지 호출을 연결하고 한 호출에서 다른 호출로 데이터를 전달할 수 있으므로 가장 적합합니다. 다음 코드 샘플은 전체 솔루션을 보여줍니다.

<code class="javascript">function first() {
  return $.ajax(...);
}

function second(data, textStatus, jqXHR) {
  return $.ajax(...);
}

function third(data, textStatus, jqXHR) {
  return $.ajax(...);
}

function main() {
  first().then(second).then(third);
}</code>

인수 data, textStatus 및 jqXHR은 이전 호출의 $.ajax() 호출에서 각 후속 함수로 전달됩니다. 이를 통해 데이터를 first()에서 second()로, second()에서 third()로 전달할 수 있어 호출이 동기적으로 실행되고 데이터가 둘 사이에서 원활하게 흐르도록 할 수 있습니다.

또한 다음을 사용할 수도 있습니다. 테스트 또는 솔루션 개발 중에 $.ajax(...) 대신 이행된 약속을 전달하는 $.when('foo') 와 같은 도우미 기능입니다.

위 내용은 jQuery Promises를 사용하여 세 개의 비동기 HTTP 호출을 순차적으로 실행하려면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.