JavaScript의 약속 유형

오타와 문법적 실수를 용서하세요. 저는 아직 배우는 중입니다. ?

약속이란 무엇입니까?

Promise는 JavaScript에서 비동기 작업을 처리하는 방법입니다. 이는 현재 또는 미래에 사용할 수 있거나 전혀 사용할 수 없는 값을 나타냅니다. 약속에는 보류, 이행, 거부의 세 가지 상태가 있습니다.

약속의 유형

1. 보류 중: Promise의 초기 상태입니다. 아직 작업이 진행 중이고 완료되지 않았음을 나타냅니다.

2. 이행됨: 작업이 성공적으로 완료된 경우 약속의 상태입니다. 약속에는 가치가 있으며, 사용할 수 있습니다.

3. 거부됨: 작업이 실패했을 때 Promise의 상태입니다. Promise에는 실패 이유가 있으며, catch 메소드를 사용하여 처리할 수 있습니다.

약속은 왜 중요한가요?

• 더 깔끔하고 읽기 쉬운 비동기 코드를 작성하는 데 도움이 될 것이라고 약속합니다.
• 더 구조화된 방식으로 비동기 작업을 처리하는 방법을 제공합니다.
• Promise를 서로 연결하여 여러 비동기 작업을 순차적으로 수행할 수 있습니다.
• 데이터 가져오기, 여러 작업 처리, 빠른 결과를 위한 경주 등 최신 JavaScript에서는 약속이 필수적입니다.

1. 단순한 약속

const promise = new Promise((resolve, reject) => {
    // Imagine fetching user data from an API
    const user = {
        name: "Aasim Ashraf",
        age: 21,
    };

    user ? resolve(user) : reject("User not found");
});

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

API 호출이나 비동기 작업에 자주 사용되는 해결 또는 거부 약속입니다.

• 사용 시기: API에서 데이터를 가져오는 것과 같은 단일 비동기 작업에 사용됩니다.
• 장점 : 성공과 실패를 한 블록에서 깔끔하게 처리합니다.

2. Promise.all 다중 작업

const fetchUser = fetch("/users").then((res) => res.json());
const fetchPosts = fetch("/posts").then((res) => res.json());

Promise.all([fetchUser, fetchPosts])
    .then(([user, posts]) => {
        console.log(user, posts);
    })
    .catch((error) => console.log(error));

모든 약속이 해결되기를 기다립니다. 하나가 실패하면 전체 체인이 실패합니다. 함께 해결해야 하는 여러 비동기 작업에 가장 적합합니다.

• 사용 시기: 서로 의존하지 않는 여러 비동기 작업에 사용
• 장점 : 여러 데이터를 한 번에 가져와 함께 처리합니다.
• 단점 : 하나가 실패하면 모두 실패한다.

Promise.all에서 하나의 약속이 실패하면 어떻게 되나요?

const fetchUser = fetch("/users").then((res) => res.json());
const fetchPosts = fetch("/posts").then((res) => res.json());

Promise.all([fetchUser, fetchPosts])
    .then(([user, posts]) => {
        console.log(user, posts);
    })
    .catch((error) => console.log(error));

Promise.all의 문제점은 하나의 Promise가 실패하면 전체 체인이 실패한다는 것입니다. 이를 방지하려면 Promise.allSettled를 사용하면 됩니다.

3. Promise.allSettled

const fetchUser = fetch("/users").then((res) => res.json());
const fetchPosts = fetch("/posts").then((res) => res.json());

Promise.allSettled([fetchUser, fetchPosts])
    .then((results) => {
        results.forEach((result) => {
            if (result.status === "fulfilled") {
                console.log("User Data:", result.value);
            } else {
                console.log("Error:", result.reason);
            }
        });
    });

Promise.allSettled는 해결 또는 거부 여부에 관계없이 모든 약속이 확정되기를 기다립니다. 상태와 값 또는 이유가 포함된 객체 배열을 반환합니다.

• 사용시기 :실패까지 모든 결과를 알고 싶을 때.
• 장점 : 여러 데이터를 한 번에 가져와 함께 처리합니다.
• 단점 : 하나라도 실패하면 체인이 멈추지 않는다

4. Promise.race 가장 빠른 결과

const fast = new Promise(resolve => setTimeout(resolve, 1000, "Fast"));

const slow = new Promise(resolve => setTimeout(resolve, 2000, "Slow"));

Promise.race([fast, slow])
    .then((result) => {
        console.log(result);
    })
    .catch((error) => console.log(error));

해결 여부에 관계없이 해결하겠다는 첫 번째 약속의 결과를 반환합니다. 첫 번째 응답을 로드하는 등 속도가 필요할 때 유용합니다.

• 사용 시기 : 모든 결과를 기다리는 것보다 속도가 더 중요한 경우.
• 한도: 가장 빠른 약속이 실패할 경우 오류가 발생할 수 있습니다.

Promise.race의 약속이 실패하면 어떻게 되나요?

const error = new Promise((resolve) => {
    setTimeout(() => resolve("Error"), 1000);
});

const success = new Promise((resolve) => {
    setTimeout(() => resolve("Success"), 2000);
});

Promise.race([error, success])
    .then((result) => {
        console.log(result);
    })
    .catch((error) => console.log("First Rejected",error));

첫 번째 약속이 실패하면 전체 체인이 실패합니다. 이를 방지하려면 Promise.any를 사용할 수 있습니다.

5. Promise.any 첫 번째 성공적인 결과

const promise1 = Promise.reject("Error 1");
const promise2 = new Promise(resolve => setTimeout(resolve, 3000, "Promise 2"));

Promise.any([promise1, promise2])
    .then((result) => {
        console.log("First Success",result);
    })
    .catch((error) => console.log("All Rejected",error));

Promise 중 하나라도 해결되면 해결됩니다. 모든 Promise가 거부될 때까지 모든 거부를 무시합니다. 나머지에 관계없이 첫 번째 성공적인 결과가 필요할 때 유용합니다.

• 사용 시기 : 나머지 약속에 관계없이 첫 번째 성공적인 결과가 필요할 때.
• 제한: 모든 Promise가 거부되면 오류가 발생합니다.

요약

• 간단한 약속: API에서 데이터를 가져오는 것과 같은 단일 비동기 작업의 경우
• Promise.all: 서로 종속되지 않는 여러 비동기 작업에 사용됩니다.
• Promise.allSettled: 실패까지 모든 결과를 알고 싶을 때.
• Promise.race: 모든 결과를 기다리는 것보다 속도가 더 중요한 경우.
• Promise.any: 나머지 약속에 관계없이 첫 번째 성공적인 결과가 필요한 경우.

최종 생각

• 올바른 유형의 Promise를 선택하는 것이 효율적인 비동기 프로그래밍의 핵심입니다.
• 속도, 다중 작업 또는 모든 결과 처리 등 사용 사례에 가장 적합한 Promise를 사용하세요.

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