JavaScript로 펌블하기

JavaScript 약속 이해하기

프라미스는 비동기 작업 처리를 단순화하는 JavaScript의 강력한 기능입니다. "콜백 지옥"과 같은 문제를 피하면서 비동기 코드로 작업하는 더 깔끔하고 직관적인 방법을 제공합니다.

---

약속이란 무엇입니까?

Promise는 비동기 작업의 최종 완료(또는 실패)와 그 결과 값을 나타내는 개체입니다. 이를 통해 작업을 연결하고 오류를 효과적으로 처리하여 보다 관리하기 쉬운 비동기 코드를 작성할 수 있습니다.

약속의 상태

Promise에는 세 가지 상태가 있습니다.

• 보류 중: 이행도 거부도 아닌 초기 상태입니다.
• 이행됨: 작업이 성공적으로 완료되었으며 약속에 결과 값이 있습니다.
• 거부됨: 작업이 실패했으며 Promise에 실패 이유가 있습니다(대개 오류).

예:

const promise = new Promise((resolve, reject) => {
  let success = true; // Change to false to simulate rejection

  if (success) {
    resolve("Operation was successful!");
  } else {
    reject("Operation failed.");
  }
});

promise
  .then((result) => console.log(result))
  .catch((error) => console.error(error));

---

약속 방법

1. 그런 다음()

• 약속 이행을 ​​처리하는 데 사용됩니다.
• 체인을 활성화하는 또 다른 약속을 반환합니다.

promise
  .then((result) => {
    console.log(result);
    return "Next Step";
  })
  .then((nextResult) => console.log(nextResult));

2. 캐치()

• 약속 거부를 처리하는 데 사용됩니다.

promise.catch((error) => console.error(error));

3. 드디어()

• Promise의 결과에 관계없이 코드 조각을 실행하는 데 사용됩니다.

promise.finally(() => console.log("Cleanup actions."));

4. 약속.모두()

• 배열의 모든 Promise가 해결되면 해결됩니다.
• 약속이 거부되면 즉시 거부합니다.

const promise1 = Promise.resolve(10);
const promise2 = Promise.resolve(20);

Promise.all([promise1, promise2]).then((results) => console.log(results));

5. Promise.allSettled()

• 모든 약속이 이행되기를 기다립니다(이행 또는 거부).

const promise1 = Promise.resolve("Success");
const promise2 = Promise.reject("Error");

Promise.allSettled([promise1, promise2]).then((results) => console.log(results));

6. 약속.경주()

• Promise 중 하나가 해결되거나 거부되자마자 해결되거나 거부됩니다.

const promise1 = new Promise((resolve) => setTimeout(resolve, 500, "One"));
const promise2 = new Promise((resolve) => setTimeout(resolve, 100, "Two"));

Promise.race([promise1, promise2]).then((result) => console.log(result));

7. 약속.아무거나()

• 약속이 이행되는 즉시 해결됩니다.
• 모든 약속이 거부되면 거부됩니다.

const promise1 = Promise.reject("Error 1");
const promise2 = Promise.resolve("Success");
const promise3 = Promise.reject("Error 2");

Promise.any([promise1, promise2, promise3]).then((result) => console.log(result));

---

약속을 연결하다

체인을 사용하면 여러 비동기 작업을 순차적으로 처리할 수 있습니다.

fetch("https://api.example.com/data")
  .then((response) => response.json())
  .then((data) => {
    console.log(data);
    return fetch("https://api.example.com/other-data");
  })
  .then((otherResponse) => otherResponse.json())
  .then((otherData) => console.log(otherData))
  .catch((error) => console.error("Error:", error));

---

약속의 오류 처리

오류는 catch() 블록에 의해 포착될 때까지 Promise 체인을 통해 전파됩니다.

fetch("https://api.example.com/data")
  .then((response) => {
    if (!response.ok) throw new Error("Network response was not ok");
    return response.json();
  })
  .then((data) => console.log(data))
  .catch((error) => console.error("Error:", error));

---

실제 사용 사례 예

여기에서 Promise의 자세한 실제 사용 사례를 살펴볼 수 있습니다.

<script></script>

---

결론

JavaScript Promise는 비동기 작업을 명확하고 효율적으로 처리하는 강력한 방법을 제공합니다. Promise를 마스터하면 더 깔끔하고 유지 관리하기 쉬운 코드를 작성하고 콜백 지옥과 같은 함정을 피할 수 있습니다. 위의 방법과 예제를 통해 연습을 시작하면 비동기 JavaScript를 마스터하는 데 큰 도움이 될 것입니다!

위 내용은 JavaScript로 펌블하기의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!