타입을 전달하고, 조건부를 통과하고, 객체를 반환하기위한 좋은 디자인 패턴은 무엇입니까?

Question

const someFailedAction = (caseIds, growlMessages) => { 

    if (caseIds.length > 1) { 
     toastr.error(growlMessages[0], errorToastrOptions); 
    } else if (isCaseDetailsDisplayed) { 
     toastr.error(growlMessages[1], errorToastrOptions); 
    } else if (errorParts.fieldIds.length === 0) { 
     toastr.error(growlMessages[2], errorToastrOptions); 
    } else { 
     toastr.error(growlMessages[3], errorToastrOptions); 
    } 
} 

나는 다른 케이스 액션의 실패에서 실행되는 위와 같은 조건문을 많이 가지고 있습니다. 액션의 대부분은 동일한 if/elseIf 구조체를 가지고 있지만, 일부는 추가 elseIf 또는 하나 이상의 뺄셈을가집니다. 난 그냥 긴, 중첩, 반복적 인 스위치 문을하지 않고 유형과 메시지의 배열에 전달할 수있는 좋은 디자인 패턴이 있다면

const SomeOtherFailedAction = (caseIds, growlMessages) => { 

    if (caseIds.length > 1) { 
     toastr.error(growlMessages[0], errorToastrOptions); 
    } else if (isCaseDetailsDisplayed) { 
     toastr.error(growlMessages[1], errorToastrOptions); 
    } else { 
     toastr.error(growlMessages[2], errorToastrOptions); 
    } 

} 

은 궁금했다.

Answer 1

그냥 논리 값의 배열을 사용하고 succeeeds 인덱스 찾기 :

const i = [ 
caseIds.length > 1, 
isCaseDetailsDisplayed, 
errorParts.fieldIds.length === 0, 
true 
].indexOf(true); 

toastr.error(growlMessages[i], errorToastrOptions) 

을 다른 방법을, 당신은 기능의 재사용 배열을 저장할 수, 다른 후 하나를 실행하고 함수가 true를 돌려 최초의 인덱스를 반환합니다 :

const tests = [ 
() => caseIds.length > 1, 
() => isCaseDetailsDisplayed, 
() => errorParts.fieldIds.length === 0, 
() => true 
] 

const i = tests.findIndex(f => f()); 

toastr.error(growlMessages[i], errorToastrOptions) 

Answer 2

조나스 솔루션은 매우 효율적입니다. 참고로 기본 인덱스를 설정하여 가지고있는 것을 마를 수 있으며 조건부에서만 재정의 할 수 있습니다. 그럼 난 것을 볼 수 귀하의 경우에는 마지막

const someFailedAction = (caseIds, growlMessages) => { 

    let idx = 3// replaces final `else` and is default 

    if (caseIds.length > 1) { 
     idx=0;   
    } else if (isCaseDetailsDisplayed) { 
     idx = 1;   
    } else if (errorParts.fieldIds.length === 0) { 
     idx= 2;   
    }// last `else` removed since already have a default 

    toastr.error(growlMessages[idx], errorToastrOptions); 
}