> 웹 프론트엔드 > JS 튜토리얼 > JavaScript의 약속 체이닝이란 무엇입니까?

JavaScript의 약속 체이닝이란 무엇입니까?

王林
풀어 주다: 2023-09-08 15:45:07
앞으로
808명이 탐색했습니다.

JavaScript 中的 Promise 链是什么?

이 튜토리얼에서는 JavaScript의 Promise Chaining에 대해 설명합니다. Promise 체인으로 전환하기 전에 먼저 Promise가 무엇인지부터 이야기해 봅시다

그래서 우리는 JavaScript가 단일 스레드라는 것을 알고 있습니다. 즉, 아래와 같이 실행할 함수가 하나인 호출 스택이 하나만 있기 때문에 두 함수가 동시에 실행될 수 없다는 것을 의미합니다

한 함수가 실행을 완료하면 다른 함수가 실행을 시작하므로 두 개 이상의 함수를 동시에 실행하기 위해 JavaScript 예제에서 비동기 프로그래밍을 사용합니다. setTimeout 함수는 콜백 함수와 지정된 시간을 허용하고 그 후에는 함수 실행됩니다.

으아악

그래서 우리는 비동기 작업의 결과와 완료 또는 실패를 제공하는 비동기 작업에 Promise를 사용합니다.

실생활에서와 마찬가지로 우리는 약속을 하는 것과 같은 방식으로 무엇이든 약속하며, 이는 세 가지 상태 중 하나로 존재합니다.

  • Pending - 초기 상태를 나타내며 완료되지도 거부되지도 않음을 의미합니다.
  • Fulfilled - 이는 우리가 할당한 작업이 성공적으로 완료되었음을 의미합니다.
  • Denied - 이 상태는 작업을 수행할 수 없어 거부되었음을 의미합니다.

비동기 메서드는 값을 반환하지만 최종 값을 반환하는 대신 나중에 함수에 값을 제공하겠다는 약속을 반환합니다.

Promise 문 다음에 then() 메서드를 사용하여 Promise를 실행하고, 오류로 인해 거부되면 catch 블록을 사용하여 처리됩니다.

JavaScript에서 Promise를 어떻게 선언하나요?

으아악

여기에는 Promise 내부에 콜백 함수라는 함수가 있습니다. 이 함수에는 resolve()reject() 두 가지 메서드로 매개변수가 있습니다. 두 가지 모두에 대한 위의 설명에서 이미 알고 있습니다.

여기서 해결은 주어진 함수의 성공적인 완료를 보장하는 반면, 거부는 주어진 실행 가능한 콜백 함수의 실패한 완료에 대한 책임을 보장합니다.

예 1

Set을 사용하여 문자열에서 고유한 문자를 찾는 프로그램을 살펴보겠습니다.

으아악

위 내부. then() 메서드는 콜백 함수를 전달하고 value 변수는 해결() 메서드의 결과를 인쇄하는 역할을 합니다.

커미트먼트 체인이란 무엇인가요?

Promise 체인은 기본적으로 여러 개의 비동기 함수 호출이며 동기 방식으로 하나씩 실행됩니다. then() 메소드.

예 2

예문을 통해 자세히 이해해 볼까요?

으아악

프로미스 체인이 어떻게 작동하는지 이해해 봅시다.

  • 첫번째 약속이 이루어졌습니다.
  • 그런 다음 새로운 Promise를 생성하고 해결되는 .then() 메서드가 호출됩니다.
  • .then() 메서드를 다시 호출하면 새 Promise가 생성되고 이 Promise도 해결됩니다.
  • 다시 한번 말씀드리지만, 작동 중입니다. 또 다른 Promise 핸들러를 추가할 수도 있습니다.

따라서 기본적으로 .then() 메서드는 새 Promise를 반환하고 .then()을 사용하여 next 등을 호출합니다.

예 3

으아악

그래서 우리는 기본부터 헌신 체인까지 작동 방식에 대한 심층적인 개념을 봅니다.

위 내용은 JavaScript의 약속 체이닝이란 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:tutorialspoint.com
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿