> 웹 프론트엔드 > JS 튜토리얼 > Promise 체인에서 setTimeout을 사용하면 체인이 끊어지는 이유는 무엇이며 어떻게 해결할 수 있나요?

Promise 체인에서 setTimeout을 사용하면 체인이 끊어지는 이유는 무엇이며 어떻게 해결할 수 있나요?

Patricia Arquette
풀어 주다: 2024-10-29 02:48:02
원래의
1106명이 탐색했습니다.

Why does using setTimeout in a promise chain break the chain, and how can it be fixed?

Promise Chain에서 setTimeout 사용

Promise는 비동기 작업의 순차적 순서를 제공하여 개발자가 콜백 기반 코드를 마치 마치 동기식이었습니다. 그러나 Promise 체인의 작업 간에 지연을 도입하면 문제가 발생할 수 있습니다.

질문:

제공된 코드 조각에서 setTimeout을 사용하여 지연을 시도했지만 결과는 JSON 구문 분석 오류가 발생했습니다. 왜 이런 일이 발생하며, 어떻게 해결할 수 있나요?

<code class="javascript">...
getLinks('links.txt').then(function(links){
    let all_links = (JSON.parse(links));
    globalObj=all_links;

    return getLinks(globalObj["one"]+".txt");

}).then(function(topic){
    writeToBody(topic);
    setTimeout(function(){
         return getLinks(globalObj["two"]+".txt"); // without setTimeout it works fine
         },1000);
});
...</code>
로그인 후 복사

답변:

이 문제는 setTimeout이 약속을 반환하지 않기 때문에 발생합니다. 기본적으로 Promise 체인에서 값을 반환하면 해당 값은 확인된 Promise 객체로 래핑됩니다. 그러나 setTimeout은 타이머 ID를 반환하므로 Promise 체인이 깨지고 반환된 값은 Promise로 처리되지 않습니다.

이 문제를 해결하려면 다음 접근 방식을 사용할 수 있습니다.

1. Promise 체인 외부에서 지연 함수 만들기:

setTimeout을 사용하는 대신 Promise에서 지연을 래핑하는 지연 함수를 정의합니다.

<code class="javascript">function delay(t, val) {
    return new Promise(resolve => setTimeout(resolve, t, val));
}</code>
로그인 후 복사

업데이트된 코드:

<code class="javascript">...
getLinks('links.txt').then(function(links){
    let all_links = (JSON.parse(links));
    globalObj=all_links;

    return getLinks(globalObj["one"]+".txt");

}).then(function(topic){
    writeToBody(topic);
    // return a promise here that will be chained to prior promise
    return delay(1000).then(function() {
        return getLinks(globalObj["two"]+".txt");
    });
});
...</code>
로그인 후 복사

2. Promise 객체에 지연 메서드 추가:

더 우아한 해결책은 지연 메서드로 Promise 객체를 확장하는 것입니다:

<code class="javascript">Promise.prototype.delay = function(t) {
    return this.then(function(val) {
        return delay(t, val);
    });
}</code>
로그인 후 복사

업데이트된 코드:

<code class="javascript">...
getLinks('links.txt').then(function(links){
    let all_links = (JSON.parse(links));
    globalObj=all_links;

    return getLinks(globalObj["one"]+".txt");

}).then(function(topic){
    writeToBody(topic);
    // return a promise using the delay method
    return Promise.resolve().delay(1000).then(function() {
        return getLinks(globalObj["two"]+".txt");
    });
});
...</code>
로그인 후 복사

이러한 기술을 사용하면 연결 동작을 손상시키지 않고 런타임 오류를 방지하면서 약속 체인에 지연을 도입할 수 있습니다.

위 내용은 Promise 체인에서 setTimeout을 사용하면 체인이 끊어지는 이유는 무엇이며 어떻게 해결할 수 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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