javascript：switchケースで条件を使用する

そのばかげた質問でごめんなさい。javascriptのswitch-case言語要素で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){...}、ケース式がブール値に評価されることだけです。

これは、スイッチに指定した値が比較の基準として使用されるために機能します。したがって、ブール値を評価するケース式によって、実行されるケースが決まります。また、これを好転させswitch(false){..}て、目的の式を真ではなく偽に評価させることもできますが、個人的には、真実と評価される条件を処理することを好みます。ただし、それも機能するので、それが何をしているのかを理解することを覚えておく価値があります。

例：liCountが3の場合、最初の比較はtrue === (liCount == 0)であり、最初のケースがfalseであることを意味します。その後、スイッチは次のケースに進み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ステートメントと比較する必要があります（たとえば、「casewhen」ステートメントはありません）。あなたが本当にこれをしたいのなら、あなたはただ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。2番目のケースは、と(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();

スイッチにスコアを渡さないが、trueであることに注意してください。スイッチに与える値は、比較の基準として使用されます。

次の例は、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
    }
}