javascript: uso de una condición en caso de cambio [duplicar]

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

Una versión anterior de esta respuesta consideraba que los paréntesis eran los culpables. En verdad, los paréntesis son irrelevantes aquí - lo único necesario es switch(true){...} y que sus expresiones case se evalúen a booleanos.

Funciona porque, el valor que le damos al interruptor se utiliza como base para comparar. En consecuencia, las expresiones case, también evaluadas para booleanos, determinarán qué case se ejecuta. También podría dar la vuelta a esto, y pasar switch(false){..} y hacer que las expresiones deseadas evalúen a falso en lugar de verdadero.. pero personalmente prefieren tratar con condiciones que evalúan la veracidad. Sin embargo, también funciona, por lo que vale la pena tener en cuenta para entender lo que está haciendo.

Eg: si liCount es 3, la primera comparación es true === (liCount == 0), lo que significa que el primer caso es falso. El interruptor pasa entonces al siguiente caso true === (liCount<=5 && liCount>0). Esta expresión se evalúa como true, lo que significa que este caso se ejecuta, y termina en break. He añadido paréntesis aquí a hacerlo más claro, pero son opcionales, dependiendo de la complejidad de su expresión.

Es bastante simple, y una manera ordenada (si se ajusta a lo que está tratando de hacer) de manejar una larga serie de condiciones, donde tal vez una larga serie de ìf() ... else if() ... else if () ... podría introducir mucho ruido visual o fragilidad.

Úselo con precaución, porque es un patrón no estándar, a pesar de ser código válido.

Has mucho complicado eso. Escríbalo con declaraciones if en su lugar como esta:

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

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

O, si ChaosPandion está tratando de optimizar tanto como sea posible:

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

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

Desea utilizar las instrucciones if:

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

Si eso es lo que quieres hacer, sería mejor usar if declaraciones. Por ejemplo:

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

Ese es un caso en el que debe usar if cláusulas.

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

Funcionará en JavaScript siempre y cuando sus condiciones devuelvan valores boolean adecuados, pero no tiene muchas ventajas sobre las sentencias else if.

Su código no funciona porque no está haciendo lo que usted espera que haga. Los bloques de switch toman un valor y comparan cada caso con el valor dado, buscando la igualdad. Su valor de comparación es un entero, pero la mayoría de sus expresiones case se resuelven a un valor booleano.

Así que, por ejemplo, digamos liCount = 2. Su primer caso no coincidirá, porque 2 != 0. Su segundo caso, (liCount<=5 && liCount>0) se evalúa como true, pero 2 != true, por lo que este caso tampoco coincidirá.

Por esta razón, como muchos otros han dicho, usted debe utilizar una serie de if...then...else if bloques para hacer esto.

Si los valores posibles son enteros, puede agrupar casos. De lo contrario, utilice 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();