자바스크립트 약속을 배워보세요. 부분 약속이란 무엇입니까?

자바스크립트 약속을 배워보세요. 1부 — 약속이란 무엇입니까?

안녕하세요, 자바스크립트 팬 여러분, 오늘은 Promise에 대해 설명하고 약속을 더 잘 배우고 이해할 수 있는 방법을 알려드리겠습니다. 많은 분들이 어려운 주제라고 생각하고 헷갈려 하시는데, 딱히 까다로운 부분도 없고, 자주 연습하시면 전문가가 되실 거라고 장담합니다. 오늘 제 임무는 여러분이 기본 사항을 이해하도록 돕고 약속의 본질과 약속이 필요한 이유를 보여 주는 것입니다.

Promise란 무엇이며 자바스크립트에서 Promise가 왜 필요한가요?

매일 아침 지속적으로 운동하겠다고 친구들과 약속하고 그렇게 하면 친구들에게 알린다고 상상해 보세요. 귀하의 약속은 귀하 또는 귀하의 친구가 자신의 삶을 살아가는 것을 막는 것이 아니며 그들은 단지 귀하에 대한 결론이나 행동을 내리기 위해 서약의 성공 또는 실패에 대한 귀하의 통지를 기다리고 있을 뿐입니다.

이 작은 예는 이벤트로서의 약속의 성격과 이 이벤트로 연결되는 두 행위자를 보여줍니다. 이 경우 소비자(친구)와 생산자(당신)입니다.

좀 단순화하면 자바스크립트에서 Promise 클래스와 동일한 동작을 볼 수 있다고 말할 수 있습니다. 이를 통해 자바스크립트의 메인 스레드를 차단하지 않고 비동기 작업을 수행하고 작업이 끝나면 구독자에게 알릴 수 있습니다. 우리의 약속.

사용 방법을 알아보기 위해 예를 들어 보겠습니다.

이 코드를 순서대로 검토해 보겠습니다.

1. 실행자 함수(Promise 클래스 생성자에 전달하는 함수)를 사용하여 Promise 인스턴스를 생성합니다.

Executor 함수는 Promise의 기반이 되며 Promise가 생성되면 즉시 호출됩니다.

Executor 함수는 두 개의 위치 매개변수를 사용합니다. 첫 번째는 확인 방법이고 두 번째는 거부 방법입니다. 이 두 가지 방법 모두 일정 시간 내에 약속을 완료하는 역할을 합니다.

예를 들어, 우리는 일주일 동안 매일 아침에 일어나 운동을 하기로 약속했습니다. 이 경우 우리의 약속은 일주일 내내 지속되며, 3일차에 이를 지킬 수 없다면 거부 메소드를 호출하면 약속을 구독하는 모든 사람이 이를 알게 됩니다. 또는 그 반대로, 약속을 지키면 7일차에 해결 메소드를 호출하여 친구들에게 약속을 성공적으로 지켰음을 알립니다. 따라서 소비자(친구)는 결과에 대해 완전히 독립적이며, 결과가 나오면 결과를 얻을 수 있다는 것만 확인하면 됩니다.

아래 그림은 가능한 약속 상태를 보여줍니다. "보류 중", "이행됨", "거부됨"입니다. Promise가 방금 시작되면 해당 상태는 "보류 중"입니다. 완료된 후에는 완료하기 위해 어떤 메소드를 호출했는지에 따라 "fulfilled" 또는 "rejected"가 됩니다.

또한 Promise 실행자는 두 번 이상 완료할 수 없으며, 해결 또는 거부 메서드에 대한 모든 후속 호출이 무시된다는 점도 주목할 가치가 있습니다.

1. Promise를 완료했다고 말하는 순간(Resolve 또는 Reject 호출) Promise를 구독한 모든 사람은 Promise 인스턴스의 두 가지 특수 메소드 내에서 검색할 수 있는 페이로드가 포함된 알림을 받게 됩니다. . 해당 메소드는 Promise.prototype.then 및 Promise.prototype.catch입니다.

Promise.prototype.then 메소드를 사용하면 위 스크린샷과 같이 함수가 두 개의 콜백을 허용하므로 긍정적인 시나리오와 부정적인 시나리오를 동시에 처리할 수 있습니다.

Promise.prototype.catch를 사용하면 다음과 같은 부정적인 시나리오만 처리할 수 있습니다.

긍정적인 시나리오를 위해 Promise.prototype.then을 남겨두세요.

또한 Promise는 결과에 관계없이 실행되어야 하는 코드를 실행하는 데 사용할 수 있는 메서드를 제공합니다. 이 메소드는 Promise.prototype.finally입니다:

이 메서드는 이전 작업을 완료하거나 정리하기 위해 설계되었으므로 아무 것도 사용하지 않고 아무 것도 반환하지 않습니다. 예를 들어 사용자에게 메시지를 표시하거나 로더를 숨기려는 경우입니다.

좋습니다. 지금까지 Promise의 기본 사항을 다루었으므로 API에서 데이터를 요청하고 이를 원시 HTTP 응답에서 JSON으로 변환하고 출력하는 등 실제 사례로 넘어가는 것이 좋습니다. 콘솔로:

보시다시피, 실제 세계에서 사용해본 결과는 글 초반에 연습했던 스킬과 크게 다르지 않습니다. 하지만 여전히 몇 가지 새로운 사실을 발견하셨을 것입니다.

• 이전 Promise.prototype.then 및 Promise.prototype.catch 핸들러의 결과는 다음 Promise 핸들러로 전달됩니다. Response.json 메서드는 Promise를 반환하며, Promise가 실행되면 JSON을 반환하고 해당 JSON을 전달하는 다음 핸들러를 호출한다는 점을 언급해 두는 것이 좋습니다.

• Promise.prototype.finally의 경우 "보이지 않는" 핸들러이며, 이전 응답을 자신을 통해 다음 응답으로 전달한다고 할 수 있습니다.

멋지네요. 이제 Promise가 무엇인지, 어떻게 사용하는지, 어떤 상태를 가질 수 있는지 더 잘 이해하셨으리라 믿습니다. 또한, 오늘 살펴본 핵심 사항을 아래에 나열하고 싶습니다(치트시트):

요약:

• Javascript promise — 비동기 작업을 실행하고 완료되면 소비자에게 알릴 수 있는 특수 객체입니다

• Promise 인스턴스는 "보류 중", "이행됨", "거부됨"의 3가지 상태를 가질 수 있습니다

• Promise 인스턴스에는 "then", "catch" 및 "finally"라는 세 가지 주요 메서드가 있습니다.

• Promise.prototype.then — 거부와 성공적인 결과를 모두 처리하도록 설계됨

• Promise.prototype.catch — 거부된 결과를 처리하도록 설계됨

• Promise.prototype.finally — 일부 정리 작업을 수행하도록 설계됨

• 원하는 순서대로 핸들러를 연결할 수 있으며 순차적으로 실행됩니다.

• 이전 Promise의 결과가 다음 Promise에 들어가므로 Promise 체인을 확장 가능하게 만들려면 “finally” 핸들러를 제외하고 매번 핸들러에서 Promise를 반환해야 한다는 점을 기억해야 합니다.

이 주제의 다음 부분에서는 고급 Promise 기술을 다루고 그 기능에 대해 더 자세히 알아볼 예정입니다. 구독하고 좋아요를 누르고 계속 지켜봐 주시기 바랍니다!

위 내용은 자바스크립트 약속을 배워보세요. 부분 약속이란 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!