약속에서 if-else를 처리하는 방법은 무엇입니까?


87

어떤 경우에는 then()프라 미스 객체에서 반환 값을 얻을 때 다음과 같이 값의 조건에 따라 두 가지 다른 선행 작업 을 시작해야합니다 .

promise().then(function(value){
    if(//true) {
        // do something
    } else {
        // do something 
    }
})

아마도 다음과 같이 쓸 수 있다고 생각합니다.

promise().then(function(value){
    if(//true) {
        // call a new function which will return a new promise object
        ifTruePromise().then();
    } else {
        ifFalsePromise().then();
    }
})

그러나 이것으로 두 가지 질문이 있습니다.

  1. 새로운 promise를 시작하는 것이 좋은 생각인지 모르겠습니다. Promise에서 프로세스를 시작합니다.

  2. 마지막에 하나의 함수를 호출하기 위해 두 프로세스가 필요하면 어떻게합니까? 동일한 "터미널"이 있음을 의미합니다.

원래 체인을 유지하겠다는 새로운 약속을 다음과 같이 되돌리려 고했습니다.

promise().then(function(value){
    if(//true) {
        // call a new function which will return a new promise object
        // and return it
        return ifTruePromise();
    } else {
        // do something, no new promise
        // hope to stop the then chain
    }
}).then(// I can handle the result of ifTruePromise here now);

그러나이 경우에는 그것이 참이든 거짓이든 다음 then이 작동합니다.

그래서, 그것을 처리하는 가장 좋은 방법은 무엇입니까?


1
이것이 당신이 찾고있는 것일 수 있습니다. stackoverflow.com/questions/26599798/… ?
vinayr

답변:


61

함수가 promise를 반환하는 한 제안한 첫 번째 방법을 사용할 수 있습니다.

아래의 바이올린은 첫 번째로 해결 된 값이 무엇인지에 따라 다른 연결 경로를 취하는 방법을 보여줍니다.

function myPromiseFunction() {
	//Change the resolved value to take a different path
    return Promise.resolve(true);
}

function conditionalChaining(value) {
    if (value) {
        //do something
        return doSomething().then(doSomethingMore).then(doEvenSomethingMore);
    } else {
        //do something else
        return doSomeOtherThing().then(doSomethingMore).then(doEvenSomethingMore);
    }
}

function doSomething() {
    console.log("Inside doSomething function");
    return Promise.resolve("This message comes from doSomeThing function");
}

function doSomeOtherThing() {
    console.log("Inside doSomeOtherthing function");
    return Promise.resolve("This message comes from doSomeOtherThing function");
}

function doSomethingMore(message) {
    console.log(message);
    return Promise.resolve("Leaving doSomethingMore");
}

function doEvenSomethingMore(message) {
    console.log("Inside doEvenSomethingMore function");
    return Promise.resolve();
}

myPromiseFunction().then(conditionalChaining).then(function () {
    console.log("All done!");
}).
catch (function (e) {

});

조건부 연결을 하나만 만들고 반환 약속을 변수에 할당 한 다음 어느 쪽이든 실행해야하는 함수를 계속 실행할 수도 있습니다.

function conditionalChaining(value){
    if (value) {
        //do something
        return doSomething();
    } else{
        //do something else
        return doSomeOtherThing();
    }
}

var promise = myPromiseFunction().then(conditionalChaining);

promise.then(function(value){
    //keep executing functions that should be called either way
});

4

조건부 약속 사용을위한 간단한 패키지를 작성했습니다.

확인하고 싶다면 :

npm 페이지 : https://www.npmjs.com/package/promise-tree

및 github : https://github.com/shizongli94/promise-tree

패키지가 문제를 해결하는 방법을 묻는 의견에 대한 응답 :

1, 두 개체가 있습니다.

2,이 패키지의 Branch 객체는 then () 또는 catch ()에서 사용하려는 onFulfilled 및 onRejected와 같은 함수를위한 임시 저장 공간입니다. Promise에서 대응하는 인수와 동일한 인수를 사용하는 then () 및 catch ()와 같은 메서드가 있습니다. Branch.then () 또는 Branch.catch ()에서 콜백을 전달할 때 Promise.then () 및 Promise.catch ()와 동일한 구문을 사용합니다. 그런 다음 콜백을 배열에 저장하는 것 외에는 아무것도하지 않습니다.

3, Condition은 확인 및 분기를위한 조건 및 기타 정보를 저장하는 JSON 개체입니다.

4, Promise 콜백에서 조건 객체를 사용하여 조건 (부울 표현식)을 지정합니다. Condition은 사용자가 전달한 정보를 저장합니다. 사용자가 필요한 모든 정보를 제공 한 후 condition 객체는 메서드를 사용하여 이전에 Branch 객체에 저장된 promise 체인과 콜백 정보를 취하는 완전히 새로운 Promise 객체를 생성합니다. 여기서 약간 까다로운 부분은 저장된 콜백을 연결하기 전에 처음 생성 한 Promise를 사용자가 아닌 구현 자로서 해결 / 거부해야한다는 것입니다. 그렇지 않으면 새로운 약속 체인이 시작되지 않기 때문입니다.

5, 이벤트 루프 덕분에 Branch 객체는 스템 Promise 객체가 있기 전이나 후에 인스턴스화 될 수 있으며 서로 간섭하지 않습니다. 구조가 나무와 비슷하기 때문에 여기에서 "가지"와 "줄기"라는 용어를 사용합니다.

예제 코드는 npm 및 github 페이지 모두에서 찾을 수 있습니다.

그런데이 구현을 통해 분기 내에 분기를 가질 수도 있습니다. 그리고 지점은 조건을 확인하는 동일한 장소에있을 필요가 없습니다.


답변 대신 댓글을 제공하는 것 같습니다. 평판 이 충분 하면 모든 게시물 에 댓글 수 있습니다 . 또한 내가 대신 할 수있는 일을 확인하십시오 .
thewaywere apr

@thewaywere, 귀하의 요청에 응답하는 구현 세부 정보를 추가했습니다.
szl1919

0

이것이 내 fetch ()에서 한 방법입니다. 이것이 올바른 방법인지 확실하지 않지만 작동합니다.

 fetch().then(res => res.ok ? res : false).then(res => {
    if (res) {
        //res ok
    } else {
       //res not ok
    }

});
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.