Cómo acortar mis declaraciones condicionales

Tengo una declaración condicional muy larga como la siguiente:

if(test.type == 'itema' || test.type == 'itemb' || test.type == 'itemc' || test.type == 'itemd'){
    // do something.
}

Me preguntaba si podría refactorizar esta expresión / declaración en una forma más concisa.

¿Alguna idea sobre cómo lograr esto?

Coloque sus valores en una matriz y verifique si su artículo está en la matriz:

if ([1, 2, 3, 4].includes(test.type)) {
    // Do something
}

Si un navegador que admite no tiene el Array#includesmétodo, puede usar este polyfill .

Breve explicación del ~acceso directo tilde:

Actualización: dado que ahora tenemos el includesmétodo, ya no tiene sentido usar el ~hack. Simplemente mantener esto aquí para las personas que están interesadas en saber cómo funciona y / o lo han encontrado en el código de otros.

En lugar de verificar si el resultado indexOfes >= 0, hay un pequeño atajo:

if ( ~[1, 2, 3, 4].indexOf(test.type) ) {
    // Do something
}

Aquí está el violín: http://jsfiddle.net/HYJvK/

¿Como funciona esto? Si se encuentra un elemento en la matriz, indexOfdevuelve su índice. Si no se encontró el artículo, volverá -1. Sin entrar en demasiados detalles, ~es un operador NOT bit a bit , que regresará 0solo por -1.

Me gusta usar el ~acceso directo, ya que es más sucinto que hacer una comparación del valor de retorno. Desearía que JavaScript tuviera una in_arrayfunción que devuelva un booleano directamente (similar a PHP), pero eso es solo una ilusión ( Actualización: ahora lo hace. Se llama includes. Ver arriba). Tenga en cuenta que jQuery inArray, aunque comparte la firma del método PHP, en realidad imita la indexOffuncionalidad nativa (que es útil en diferentes casos, si el índice es lo que realmente busca).

Nota importante: el uso del acceso directo tilde parece estar envuelto en controversia, ya que algunos creen con vehemencia que el código no es lo suficientemente claro y debe evitarse a toda costa (vea los comentarios sobre esta respuesta). Si comparte su sentimiento, debe apegarse a la .indexOf(...) >= 0solución.

Una pequeña explicación más larga:

Los enteros en JavaScript están firmados, lo que significa que el bit más a la izquierda está reservado como el bit de signo; una bandera para indicar si el número es positivo o negativo, con un 1ser negativo.

Aquí hay algunos números positivos de muestra en formato binario de 32 bits:

1 :    00000000000000000000000000000001
2 :    00000000000000000000000000000010
3 :    00000000000000000000000000000011
15:    00000000000000000000000000001111

Ahora aquí están esos mismos números, pero negativos:

-1 :   11111111111111111111111111111111
-2 :   11111111111111111111111111111110
-3 :   11111111111111111111111111111101
-15:   11111111111111111111111111110001

¿Por qué combinaciones tan extrañas para los números negativos? Sencillo. Un número negativo es simplemente el inverso del número positivo + 1; agregar el número negativo al número positivo siempre debería rendir 0.

Para entender esto, hagamos algo de aritmética binaria simple.

Aquí es cómo agregaríamos -1a +1:

   00000000000000000000000000000001      +1
+  11111111111111111111111111111111      -1
-------------------------------------------
=  00000000000000000000000000000000       0

Y así es como agregaríamos -15a +15:

   00000000000000000000000000001111      +15
+  11111111111111111111111111110001      -15
--------------------------------------------
=  00000000000000000000000000000000        0

¿Cómo obtenemos esos resultados? Al sumar regularmente, la forma en que nos enseñaron en la escuela: comienzas en la columna de la derecha y sumas todas las filas. Si la suma es mayor que el mayor número de un solo dígito (que en decimal es9 , pero en binario es 1), llevamos el resto a la siguiente columna.

Ahora, como notará, al agregar un número negativo a su número positivo, la columna más a la derecha que no es todo 0s siempre tendrá dos 1s, que al sumarse resultarán 2. La representación binaria de dos seres 10, que lleva la 1a la siguiente columna, y puso una 0para el resultado de la primera columna. Todas las demás columnas a la izquierda tienen solo una fila con a 1, por lo que el contenido 1de la columna anterior volverá a sumarse 2, lo que luego se transferirá ... Este proceso se repite hasta llegar a la columna más a la izquierda, donde el1 ser transportado no tiene a dónde ir, por lo que se desborda y se pierde, y nos queda con 0s por todas partes.

Este sistema se llama Complemento de 2 . Puedes leer más sobre esto aquí:

Representación del complemento 2 para enteros firmados .

Ahora que el curso intensivo en el complemento de 2 ha terminado, notará que -1es el único número cuya representación binaria está 1en todas partes.

Utilizando el ~bit a bit NO operador, todos los bits de un número dado se invierten. La única forma de 0volver de invertir todos los bits es si comenzamos con 1todo.

Entonces, todo esto fue una forma larga de decir que ~nsolo volverá 0si nes así -1.

Puede usar la instrucción switch con fall thru:

switch (test.type) {

  case "itema":
  case "itemb":
  case "itemc":
  case "itemd":
    // do something
}

Usando Science: debe hacer lo que idfah dijo y esto para la velocidad más rápida mientras mantiene el código corto:

ESTO ES MÁS RÁPIDO QUE EL ~MÉTODO

var x = test.type;
if (x == 'itema' ||
    x == 'itemb' ||
    x == 'itemc' ||
    x == 'itemd') {
    //do something
}

http://jsperf.com/if-statements-test-techsin (Conjunto superior: Chrome, conjunto inferior: Firefox)

Conclusión

Si posibilidades son pocas y sabe que ciertas personas tienen más probabilidades de ocurrir que se obtiene el máximo rendimiento if ||, switch fall throughy if(obj[keyval]).

Si las posibilidades son muchas , y cualquiera de ellas podría ser la más frecuente, en otras palabras, no puede saber cuál es más probable que ocurra que obtener el mayor rendimiento de la búsqueda de objetos if(obj[keyval])y regexsi eso encaja.

http://jsperf.com/if-statements-test-techsin/12

actualizaré si surge algo nuevo.

Si está comparando con cadenas y hay un patrón, considere usar expresiones regulares.

De lo contrario, sospecho que intentar acortarlo solo ofuscará su código. Considere simplemente envolver las líneas para que quede bonito.

if (test.type == 'itema' ||
    test.type == 'itemb' ||
    test.type == 'itemc' ||
    test.type == 'itemd') {
    do something.
}

var possibilities = {
  "itema": 1,
  "itemb": 1,
  "itemc": 1,
…};
if (test.type in possibilities) { … }

Usar un objeto como una matriz asociativa es algo bastante común, pero dado que JavaScript no tiene un conjunto nativo, también puede usar objetos como conjuntos baratos.

if( /^item[a-d]$/.test(test.type) ) { /* do something */ }

o si los artículos no son tan uniformes, entonces:

if( /^(itema|itemb|itemc|itemd)$/.test(test.type) ) { /* do something */ }

Excelentes respuestas, pero podría hacer que el código sea mucho más legible envolviendo uno de ellos en una función.

Esto es complejo si la declaración, cuando usted (u otra persona) lea el código dentro de unos años, estará escaneando para encontrar la sección para comprender lo que está sucediendo. Una declaración con este nivel de lógica empresarial le hará tropezar durante unos segundos mientras trabaja en lo que está probando. Donde un código como este, le permitirá continuar escaneando.

if(CheckIfBusinessRuleIsTrue())
{
    //Do Something
}

function CheckIfBusinessRuleIsTrue() 
{
    return (the best solution from previous posts here);
}

Asigne un nombre explícito a su función para que sea inmediatamente obvio lo que está probando y su código será mucho más fácil de escanear y comprender.

Puede poner todas las respuestas en un conjunto de Javascript y luego simplemente llamar .contains()al conjunto.

Aún debe declarar todos los contenidos, pero la llamada en línea será más corta.

Algo como:

var itemSet = new Set(["itema","itemb","itemc","itemd"]);
if( itemSet.contains( test.type ){}

Una de mis formas favoritas de lograr esto es con una biblioteca como underscore.js ...

var isItem = _.some(['itema','itemb','itemc','itemd'], function(item) {
    return test.type === item;
});

if(isItem) {
    // One of them was true
}

http://underscorejs.org/#some

otra forma u otra forma increíble que encontré es esto ...

if ('a' in oc(['a','b','c'])) { //dosomething }

function oc(a)
{
  var o = {};
  for(var i=0;i<a.length;i++)  o[a[i]]='';
  return o;
}

Por supuesto, como puede ver, esto lleva las cosas un paso más allá y facilita la lógica de seguimiento.

http://snook.ca/archives/javascript/testing_for_a_v

utilizando operadores como ~ && || ((), ()) ~~ está bien solo si su código se rompe más adelante. No sabrás por dónde empezar. Entonces la legibilidad es GRANDE.

si es necesario, puedes hacerlo más corto.

('a' in oc(['a','b','c'])) && statement;
('a' in oc(['a','b','c'])) && (statements,statements);
('a' in oc(['a','b','c']))?statement:elseStatement;
('a' in oc(['a','b','c']))?(statements,statements):(elseStatements,elseStatements);

y si quieres hacer inversa

('a' in oc(['a','b','c'])) || statement;

Simplemente use una switchdeclaración en lugar de una ifdeclaración:

switch (test.type) {

  case "itema":case "itemb":case "itemc":case "itemd":
    // do your process
  case "other cases":...:
    // do other processes
  default:
    // do processes when test.type does not meet your predictions.
}

Switch también funciona más rápido que comparar muchos condicionales dentro de un if

Para listas muy largas de cadenas, esta idea ahorraría algunos caracteres (sin decir que lo recomendaría en la vida real, pero debería funcionar).

Elija un carácter que sepa que no aparecerá en su tipo de prueba, úselo como delimitador, péguelos en una cadena larga y busque eso:

if ("/itema/itemb/itemc/itemd/".indexOf("/"+test.type+"/")>=0) {
  // doSomething
}

Si sus cadenas están más restringidas, incluso podría omitir los delimitadores ...

if ("itemaitembitemcitemd".indexOf(test.type)>=0) {
  // doSomething
}

... pero tendría que tener cuidado con los falsos positivos en ese caso (por ejemplo, "embite" coincidiría en esa versión)

Para facilitar la lectura, cree una función para la prueba (sí, una función de una línea):

function isTypeDefined(test) {
    return test.type == 'itema' ||
           test.type == 'itemb' ||
           test.type == 'itemc' ||
           test.type == 'itemd';
}

entonces llámalo:

…
    if (isTypeDefined(test)) {
…
}
...

Creo que hay 2 objetivos al escribir este tipo de condición if.

1. brevedad
2. legibilidad

Como tal, a veces el n. ° 1 puede ser el más rápido, pero tomaré el n. ° 2 para facilitar el mantenimiento más adelante. Dependiendo del escenario, a menudo optaré por una variación de la respuesta de Walter.

Para comenzar, tengo una función disponible globalmente como parte de mi biblioteca existente.

function isDefined(obj){
  return (typeof(obj) != 'undefined');
}

y luego, cuando realmente quiero ejecutar una condición if similar a la suya, crearía un objeto con una lista de los valores válidos:

var validOptions = {
  "itema":1,
  "itemb":1,
  "itemc":1,
  "itemd":1
};
if(isDefined(validOptions[test.type])){
  //do something...
}

No es tan rápido como una declaración de cambio / caso y un poco más detallado que algunos de los otros ejemplos, pero a menudo obtengo la reutilización del objeto en otra parte del código que puede ser bastante útil.

Piggybacking en una de las muestras jsperf hechas anteriormente. Agregué esta prueba y una variación para comparar velocidades. http://jsperf.com/if-statements-test-techsin/6 Lo más interesante que noté es que ciertos combos de prueba en Firefox son mucho más rápidos que incluso Chrome.

Esto se puede resolver con un simple bucle for:

test = {};
test.type = 'itema';

for(var i=['itema','itemb','itemc']; i[0]==test.type && [
    (function() {
        // do something
        console.log('matched!');
    })()
]; i.shift());

Usamos la primera sección del ciclo for para inicializar los argumentos que desea hacer coincidir, la segunda sección para detener la ejecución del ciclo for y la tercera sección para hacer que el ciclo finalmente salga.