JavaScript에서 Promise를 연결할 때 이전 결과에 어떻게 액세스합니까?-JS 튜토리얼-php.cn

JavaScript에서 Promise를 연결할 때 이전 결과에 어떻게 액세스합니까?

Susan Sarandon

풀어 주다： 2024-11-28 10:04:12

원래의

586명이 탐색했습니다.

How to Access Previous Results When Chaining Promises in JavaScript?

약속 연결 및 이전 결과 공유

이 시나리오에서는 일련의 HTTP 요청을 생성하여 하나의 요청에서 응답 데이터를 전달해야 합니다. Bluebird의 Promise.join을 사용하여 다음으로 넘어갑니다. 문제는 첫 번째 요청의 응답 데이터에 액세스하는 것입니다.

이를 달성하려면 다음과 같은 여러 접근 방식 중 하나를 사용할 수 있습니다.

옵션 1: 하나의 결과를 다음으로 피드

이 접근 방식에는 Promise를 직접 연결하여 한 요청의 결과를 다음 요청에 입력으로 전달하는 것이 포함됩니다. 각 후속 .then() 핸들러는 가장 최근 결과에만 액세스할 수 있습니다.

Promise.join(
    callhttp("172.16.28.200", payload),
    callhttp("172.16.28.200", payload),
    callhttp("172.16.28.200", payload)
).then(function(first, second, third) {
    console.log([first, second, third]);
});

로그인 후 복사

그러나 이 접근 방식은 이전 결과에 대한 액세스를 허용하지 않습니다.

옵션 2: 할당 더 높은 범위에 대한 중간 결과

여기에서는 더 높은 범위에 선언된 변수에 중간 결과를 할당합니다. 이는 후속 .then() 핸들러에서 이전의 모든 결과에 대한 액세스를 제공합니다.

var r1, r2, r3;
Promise.join(
    callhttp("172.16.28.200", payload),
    callhttp("172.16.28.200", payload),
    callhttp("172.16.28.200", payload)
).then(function(result1, result2, result3) {
    r1 = result1;
    r2 = result2;
    r3 = result3;
});

로그인 후 복사

옵션 3: 하나의 객체에 결과 누적

이 접근 방식에는 객체 생성이 포함됩니다. 결과가 나올 때마다 결과를 축적합니다. 각 .then() 핸들러는 해당 결과를 객체에 추가하여 모든 이전 결과에 대한 액세스를 허용합니다.

var results = {};
Promise.join(
    callhttp("172.16.28.200", payload),
    callhttp("172.16.28.200", payload),
    callhttp("172.16.28.200", payload)
).then(function(result1, result2, result3) {
    results.result1 = result1;
    results.result2 = result2;
    results.result3 = result3;
});

로그인 후 복사

옵션 4: Nest Promises

중첩 Promise를 사용하면 중첩된 범위 내의 모든 이전 결과에 액세스하려면:

Promise.join(
    callhttp("172.16.28.200", payload),
    callhttp("172.16.28.200", payload),
    callhttp("172.16.28.200", payload)
).then(function(result1) {
    // result1 is available here
    return Promise.join(
        callhttp("172.16.28.200", payload),
        callhttp("172.16.28.200", payload)
    ).then(function(result2) {
        // result1 and result2 are available here
        return Promise.join(
            callhttp("172.16.28.200", payload)
        ).then(function(result3) {
            // result1, result2 and result3 are available here
        });
    });
})

로그인 후 복사

옵션 5: 체인을 독립적인 조각으로 나누기

체인의 일부가 독립적으로 실행될 수 있는 경우 체인을 끊고 별도로 시작한 다음 Promise.all()을 사용하여 결과를 수집할 수 있습니다.

var p1 = callhttp("172.16.28.200", payload);
var p2 = callhttp("172.16.28.200", payload).then(function(result2) {
    return someAsync(result2);
}).then(function(result2a) {
    return someOtherAsync(result2a);
});
var p3 = callhttp("172.16.28.200", payload).then(function(result3) {
    return someAsync(result3);
});
Promise.all([p1, p2, p3]).then(function(results) {
    // multiple results available in results array
    // that can be processed further here with
    // other promises
});

로그인 후 복사

옵션 6: 대기가 포함된 시퀀스 ES7

프라미스는 비동기 작업 순서를 지정하는 방법을 제공합니다. ES7에서는 Wait를 사용하여 이러한 작업의 순서를 지정하고 프로세스를 단순화할 수 있습니다.

async function someFunction() {
    const r1 = await callhttp("172.16.28.200", payload);

    // can use r1 here to formulate second http call
    const r2 = await callhttp("172.16.28.200", payload);

    // can use r1 and r2 here to formulate third http call
    const r3 = await callhttp("172.16.28.200", payload);

    // do some computation that has access to r1, r2 and r3
    return someResult;
}

someFunction().then(result => {
    // process final result here
}).catch(err => {
    // handle error here
});

로그인 후 복사

각 옵션에는 고유한 장점과 단점이 있습니다. 귀하의 애플리케이션의 특정 요구 사항에 가장 적합한 것을 선택하십시오.

위 내용은 JavaScript에서 Promise를 연결할 때 이전 결과에 어떻게 액세스합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!