자바 스크립트 : 케이스 전환에서 조건 사용

멍청한 질문에 대해 죄송합니다. javascript switch-case 언어 요소에서 케이스에 대한 조건을 어떻게 사용할 수 있습니까? 아래 예에서와 같이 변수 liCount가 <= 5 및> 0 일 때 케이스가 일치해야합니다 . 그러나 내 코드가 작동하지 않습니다.

switch (liCount) {
    case 0:
        setLayoutState('start');
        var api = $('#UploadList').data('jsp');
        api.reinitialise();
        break;
    case (liCount<=5 && liCount>0):
        setLayoutState('upload1Row');
        var api = $('#UploadList').data('jsp');
        api.reinitialise();
        break;
    case (liCount<=10 && liCount>5):
        setLayoutState('upload2Rows');
        var api = $('#UploadList').data('jsp');
        api.reinitialise();
        break;
    case (liCount>10):
        var api = $('#UploadList').data('jsp');
        api.reinitialise();
        break;                  
}

조언을 해주셔서 감사합니다!

이것은 작동합니다 :

switch (true) {
    case liCount == 0:
        setLayoutState('start');
        var api = $('#UploadList').data('jsp');
        api.reinitialise();
        break;
    case liCount<=5 && liCount>0:
        setLayoutState('upload1Row');
        var api = $('#UploadList').data('jsp');
        api.reinitialise();
        break;
    case liCount<=10 && liCount>5:
        setLayoutState('upload2Rows');
        var api = $('#UploadList').data('jsp');
        api.reinitialise();
        break;
    case liCount>10:
        var api = $('#UploadList').data('jsp');
        api.reinitialise();
        break;                  
}

이 답변의 이전 버전은 괄호를 범인으로 간주했습니다. 사실 여기서 괄호는 관련이 없습니다. 필요한 것은 switch(true){...}케이스 표현식이 부울로 평가되는 것뿐입니다 .

이는 우리가 스위치에 제공 한 값이 비교 기준으로 사용되기 때문에 작동합니다. 결과적으로 부울로 평가되는 case 표현식은 실행되는 케이스를 결정합니다. 또한 이것을 switch(false){..}뒤집어 통과 하고 원하는 표현이 참 대신 거짓으로 평가되도록 할 수 있습니다 . 그러나 개인적으로 진실로 평가되는 조건을 다루는 것을 선호합니다. 그러나 그것은 또한 작동하므로 그것이 무엇을하고 있는지 이해하는 것을 명심할 가치가 있습니다.

예 : liCount가 3이면 첫 번째 비교는입니다 true === (liCount == 0). 이는 첫 번째 경우가 거짓임을 의미합니다. 그런 다음 스위치는 다음 케이스로 이동합니다 true === (liCount<=5 && liCount>0). 이 표현식은 true로 평가되어이 케이스가 실행되고 break. 더 명확하게하기 위해 여기에 괄호를 추가했지만 표현의 복잡성에 따라 선택 사항입니다.

긴 일련의 조건을 처리하는 매우 간단하고 깔끔한 방법 (사용자가 수행하려는 작업에 적합한 경우)입니다. 일련의 긴 조건 ìf() ... else if() ... else if () ...은 많은 시각적 소음이나 취약성을 유발할 수 있습니다.

유효한 코드 임에도 불구하고 비표준 패턴이므로주의해서 사용하십시오.

당신은 한 가지 방법은 그 overcomplicated. 대신 다음과 같이 if 문으로 작성하십시오.

if(liCount == 0)
    setLayoutState('start');
else if(liCount<=5)
    setLayoutState('upload1Row');
else if(liCount<=10)
    setLayoutState('upload2Rows');

$('#UploadList').data('jsp').reinitialise();

또는 ChaosPandion 이 최대한 최적화를 시도하는 경우 :

setLayoutState(liCount == 0 ? 'start' :
               liCount <= 5 ? 'upload1Row' :
               liCount <= 10 ? 'upload2Rows' :
               null);

$('#UploadList').data('jsp').reinitialise();

if 문을 사용하려고합니다.

if (liCount === 0) {
    setLayoutState('start');
} else if (liCount <= 5) {
    setLayoutState('upload1Row');
} else if (liCount <= 10) {
    setLayoutState('upload2Rows');
}
$('#UploadList').data('jsp').reinitialise();  

아래 dmp의 답변을 참조하십시오 . 가능한 경우이 답변을 삭제했지만 수락되었으므로 이것이 차선책입니다 :)

당신은 할 수 없습니다. JS 인터프리터는 switch 문과 비교해야합니다 (예 : "case when"문이 없음). 정말로 이것을하고 싶다면 if(){ .. } else if(){ .. }블록을 만들 수 있습니다 .

switch (true) {
  case condition0:
    ...
    break;
  case condition1:
    ...
    break;
}

조건이 적절한 boolean값을 반환하는 한 JavaScript에서 작동 하지만 else if명령문에 비해 많은 이점이 없습니다 .

if절 을 사용해야하는 경우 입니다.

그것이 당신이 원하는 일이라면, if문장 을 사용하는 것이 더 낫습니다 . 예를 들면 :

if(liCount == 0){
    setLayoutState('start');
}
if(liCount<=5 && liCount>0){
    setLayoutState('upload1Row');
}
if(liCount<=10 && liCount>5){
    setLayoutState('upload2Rows');
}             
var api = $('#UploadList').data('jsp');
    api.reinitialise();

코드가 예상 한 작업을 수행하지 않기 때문에 작동하지 않습니다. 스위치 블록은 값을 취하고 각 케이스를 주어진 값과 비교하여 동등성을 찾습니다. 비교 값은 정수이지만 대부분의 케이스 표현식은 부울 값으로 확인됩니다.

예를 들어 liCount = 2. 첫 번째 케이스는 일치하지 않습니다 2 != 0. 두 번째 사례는로 (liCount<=5 && liCount>0)평가 true되지만 이므로이 2 != true사례도 일치하지 않습니다.

이러한 이유로 다른 많은 사람들이 말했듯이 일련의 if...then...else if블록을 사용하여 이를 수행해야합니다.

가능한 값이 정수이면 케이스를 묶을 수 있습니다. 그렇지 않으면 ifs를 사용하십시오.

var api, tem;

switch(liCount){
    case 0:
    tem= 'start';
    break;
    case 1: case 2: case 3: case 4: case 5:
    tem= 'upload1Row';
    break;
    case 6: case 7: case 8: case 9: case 10:
    tem= 'upload2Rows';
    break;
    default:
    break;
}
if(tem) setLayoutState((tem);
api= $('#UploadList').data('jsp');
api.reinitialise();

스위치에 점수를 전달하지 않고 사실임을 주목하십시오. 우리가 스위치에주는 값은 비교할 기준으로 사용됩니다.

아래 예제는 if 문없이 case에 조건을 추가하는 방법을 보여줍니다.

function getGrade(score) {
    let grade;
    // Write your code here
    switch(true) {
        case score >= 0 && score <= 5:
        grade = 'F';
        break;
        case score > 5 && score <= 10:
        grade = 'E';
        break;
        case score > 10 && score <= 15:
        grade = 'D';
        break;
        case score > 15 && score <= 20:
        grade = 'C';
        break;
        case score > 20 && score <= 25:
        grade = 'B';
        break;
        case score > 25 && score <= 30:
        grade = 'A';
        break;
    }

    return grade;
}

OP 질문의 특정 예 switch에서는 적절하지 않지만 스위치가 여전히 적절 / 유익한 예가 있지만 다른 평가 식도 필요합니다. 이는 표현식에 대한 기본 절을 사용하여 수행 할 수 있습니다.

switch (foo) {
  case 'bar':
    // do something
    break;
  case 'foo':
    // do something
    break;
  ... // other plain comparison cases
  default:
    if (foo.length > 16) {
      // something specific
    } else if (foo.length < 2) {
      // maybe error
    } else {
      // default action for everything else
    }
}