javascript: usando uma condição em caso de troca

Desculpe por essa pergunta idiota. Como posso usar uma condição para um caso no elemento de linguagem javascript switch-case? Como no exemplo abaixo, um caso deve corresponder quando a variável liCounté <= 5 e> 0; no entanto, meu código não funciona:

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;                  
}

Obrigado por qualquer conselho!

Isso funciona:

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;                  
}

Uma versão anterior dessa resposta considerava os parênteses os culpados. Na verdade, os parênteses são irrelevantes aqui - a única coisa necessária é switch(true){...}e para que suas expressões de caso sejam avaliadas como booleanos.

Funciona porque o valor que atribuímos ao switch é usado como base para comparação. Consequentemente, as expressões de caso, também avaliando para booleanos, determinarão qual caso será executado. Também poderia inverter isso e passar switch(false){..}e ter as expressões desejadas avaliadas como falsas em vez de verdadeiras ... mas pessoalmente prefere lidar com condições que avaliam a veracidade. No entanto, também funciona, portanto, vale a pena ter em mente para entender o que está fazendo.

Ex: se liCount for 3, a primeira comparação é true === (liCount == 0), o que significa que o primeiro caso é falso. O switch então passa para o próximo caso true === (liCount<=5 && liCount>0). Esta expressão é avaliada como verdadeira, o que significa que este caso é executado e termina no break. Eu adicionei parênteses aqui para deixar isso mais claro, mas eles são opcionais, dependendo da complexidade de sua expressão.

É muito simples e uma maneira legal (se se encaixa com o que você está tentando fazer) de lidar com uma longa série de condições, onde talvez uma longa série de ìf() ... else if() ... else if () ...pode introduzir muito ruído visual ou fragilidade.

Use com cautela, pois é um padrão fora do padrão, apesar de ser um código válido.

Você maneira demasiado complicada que isso. Escreva-o com instruções if em vez disso:

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

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

Ou, se ChaosPandion está tentando otimizar o máximo possível:

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

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

Você deseja usar instruções if:

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

Veja a resposta do dmp abaixo. Eu excluiria esta resposta se pudesse, mas foi aceita, então esta é a próxima melhor coisa :)

Você não pode. Os intérpretes JS exigem que você compare com a instrução switch (por exemplo, não há instrução "caso quando"). Se você realmente quiser fazer isso, basta fazer if(){ .. } else if(){ .. }blocos.

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

funcionará em JavaScript, desde que suas condições retornem booleanvalores adequados , mas não tem muitas vantagens sobre as else ifinstruções.

É um caso em que você deve usar ifcláusulas.

Se é isso que você deseja fazer, seria melhor usar ifinstruções. Por exemplo:

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();

Seu código não funciona porque não está fazendo o que você espera que faça. Os blocos de alternância recebem um valor e comparam cada caso com o valor fornecido, procurando igualdade. Seu valor de comparação é um número inteiro, mas a maioria das expressões de caso resolve para um valor booleano.

Então, por exemplo, digamos liCount = 2. Seu primeiro caso não corresponderá, porque 2 != 0. Seu segundo caso, (liCount<=5 && liCount>0)avalia para true, mas2 != true , portanto, este caso também não corresponderá.

Por esse motivo, como muitos outros já disseram, você deve usar uma série de if...then...else ifblocos para fazer isso.

se os valores possíveis forem inteiros, você pode agrupar casos. Caso contrário, use 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();

Observe que não passamos pontuação para o switch, mas é verdade. O valor que atribuímos ao switch é usado como base para comparação.

O exemplo abaixo mostra como podemos adicionar condições no caso: sem nenhuma instrução if.

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;
}

Embora no exemplo particular da pergunta do OP switchnão seja apropriado, há um exemplo em que a troca ainda é apropriada / benéfica, mas outras expressões de avaliação também são necessárias. Isso pode ser feito usando a cláusula padrão para as expressões:

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
    }
}