Como diminuir minhas declarações condicionais

Eu tenho uma declaração condicional muito longa como a seguinte:

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

Eu queria saber se eu poderia refatorar essa expressão / declaração de uma forma mais concisa.

Alguma idéia de como conseguir isso?

Coloque seus valores em uma matriz e verifique se o item está na matriz:

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

Se um navegador que você suporta não possui o Array#includesmétodo, você pode usar esse polyfill .

Breve explicação do ~atalho til:

Atualização: Como agora temos o includesmétodo, não há mais sentido em usar o ~hack. Basta mantê-lo aqui para pessoas interessadas em saber como ele funciona e / ou o encontraram no código de outras pessoas.

Em vez de verificar se o resultado indexOfé >= 0, existe um pequeno atalho:

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

Aqui está o violino: http://jsfiddle.net/HYJvK/

Como é que isso funciona? Se um item for encontrado na matriz, indexOfretornará seu índice. Se o item não foi encontrado, ele retornará -1. Sem entrar em muitos detalhes, ~é um operador NOT bit bit , que retornará 0apenas para -1.

Eu gosto de usar o ~atalho, pois é mais sucinto do que fazer uma comparação no valor de retorno. Eu gostaria que o JavaScript tivesse uma in_arrayfunção que retorne um booleano diretamente (semelhante ao PHP), mas isso é apenas uma ilusão ( atualização: agora funciona).includes . Veja acima). Observe que o jQuery inArray, enquanto compartilha a assinatura do método PHP, na verdade imita a indexOffuncionalidade nativa (que é útil em diferentes casos, se o índice for o que você realmente procura).

Nota importante: O uso do atalho til parece estar envolvido em controvérsias, pois alguns acreditam veementemente que o código não é suficientemente claro e deve ser evitado a todo custo (consulte os comentários nesta resposta). Se você compartilha o sentimento deles, deve se ater ao.indexOf(...) >= 0 solução.

Um pouco mais de explicação:

Inteiros em JavaScript são assinados, o que significa que o bit mais à esquerda é reservado como o bit de sinal; uma bandeira para indicar se o número é positivo ou negativo, com um1 negativo.

Aqui estão alguns exemplos de números positivos no formato binário de 32 bits:

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

Agora, aqui estão os mesmos números, mas negativos:

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

Por que combinações tão estranhas para os números negativos? Simples. Um número negativo é simplesmente o inverso do número positivo + 1; adicionar o número negativo ao número positivo deve sempre gerar0 .

Para entender isso, vamos fazer uma aritmética binária simples.

Aqui está como adicionaríamos -1a +1:

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

E aqui está como adicionaríamos -15a +15:

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

Como obtemos esses resultados? Fazendo acréscimos regulares, da maneira como fomos ensinados na escola: você começa na coluna mais à direita e soma todas as linhas. Se a soma for maior que o maior número de um dígito (que é decimal 9, mas em binário 1), transportamos o restante para a próxima coluna.

Agora, como você notará, ao adicionar um número negativo ao número positivo, a coluna mais à direita, que não é todos os 0s, sempre terá dois 1s, que, quando somados, resultarão em 2. A representação binária de dois seres 10, carregamos a 1para a próxima coluna e colocamos um 0para o resultado na primeira coluna. Todas as outras colunas à esquerda têm apenas uma linha com a 1, portanto, a 1passagem da coluna anterior será adicionada novamente 2, que será transferida ... Esse processo se repete até chegar à coluna mais à esquerda, onde o 1transportador não tem para onde ir, então transborda e se perde, e ficamos com 0s por toda parte.

Este sistema é chamado de Complemento 2 . Você pode ler mais sobre isso aqui:

Representação do complemento 2 para números inteiros assinados .

Agora que o curso intensivo do complemento 2 terminou, você notará que esse -1é o único número cuja representação binária está 1em todo o lado.

Usando o ~operador NOT bit a bit, todos os bits em um determinado número são invertidos. A única maneira de 0voltar a inverter todos os bits é se começarmos com 1todos os lados.

Então, tudo isso foi um longo modo de dizer que ~nsó voltará 0se nfor -1.

Você pode usar a instrução switch com fall thru:

switch (test.type) {

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

Usando Science: você deve fazer o que o idfah disse e isso para obter a velocidade mais rápida, mantendo o código curto:

ISSO É MAIS RÁPIDO DO QUE O ~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)

Conclusão:

Se houver possibilidades poucos e você sabe que certas pessoas são mais prováveis de ocorrer do que você obter o máximo desempenho fora if ||, switch fall througheif(obj[keyval]) .

Se houver possibilidades muitas , e qualquer uma delas pode ser a que mais ocorre, em outras palavras, você não sabe o que é mais provável de ocorrer do que obtém o máximo desempenho da pesquisa de objeto if(obj[keyval])e regexse isso se encaixa.

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

Eu atualizarei se algo novo surgir.

Se você estiver comparando com seqüências de caracteres e houver um padrão, considere usar expressões regulares.

Caso contrário, suspeito que tentar reduzi-lo apenas ofuscará seu código. Considere simplesmente envolver as linhas para torná-lo 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 um objeto como uma matriz associativa é uma coisa bastante comum, mas como o JavaScript não tem um conjunto nativo, você também pode usar objetos como conjuntos baratos.

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

ou se os itens não forem tão uniformes, então:

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

Respostas excelentes, mas você pode tornar o código muito mais legível envolvendo uma delas em uma função.

É uma declaração complexa, se você (ou outra pessoa) ler o código dentro de alguns anos, estará pesquisando para encontrar a seção para entender o que está acontecendo. Uma declaração com esse nível de lógica de negócios fará com que você tropece por alguns segundos enquanto trabalha no que está testando. Onde um código como este, permitirá que você continue a digitalização.

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

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

Nomeie sua função explicitamente para que fique óbvio imediatamente o que você está testando e seu código será muito mais fácil de digitalizar e entender.

Você pode colocar todas as respostas em um conjunto Javascript e depois chamar.contains() o conjunto.

Você ainda precisa declarar todo o conteúdo, mas a chamada em linha será mais curta.

Algo como:

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

Uma das minhas maneiras favoritas de fazer isso é com uma 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

outra maneira ou outra maneira incrível que eu encontrei é essa ...

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

é claro que, como você pode ver, isso leva as coisas um passo adiante e facilita o acompanhamento da lógica.

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

usando operadores como ~ && || ((), ()) ~~ só funciona se o seu código quebrar mais tarde. Você não saberá por onde começar. Portanto, a legibilidade é GRANDE.

se necessário, você pode torná-lo mais curto.

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

e se você quiser fazer inverso

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

Basta usar uma switchdeclaração em vez de uma ifdeclaração:

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 também funciona mais rápido do que comparar muitos condicionais dentro de um if

Para listas muito longas de strings, essa idéia salvaria alguns caracteres (sem dizer que eu recomendaria na vida real, mas deve funcionar).

Escolha um caractere que você sabe que não ocorrerá em seu test.type, use-o como um delimitador, cole todos em uma sequência longa e pesquise:

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

Se suas seqüências de caracteres estiverem mais restritas, você pode até omitir os delimitadores ...

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

... mas você deve ter cuidado com falsos positivos nesse caso (por exemplo, "embite" corresponderia nessa versão)

Para facilitar a leitura, crie uma função para o teste (sim, uma função de uma linha):

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

então chame-o:

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

Eu acho que existem 2 objetivos ao escrever esse tipo de condição.

1. brevidade
2. legibilidade

Como tal, algumas vezes o nº 1 pode ser o mais rápido, mas usarei o nº 2 para facilitar a manutenção posteriormente. Dependendo do cenário, geralmente optarei por uma variação da resposta de Walter.

Para começar, tenho uma função disponível globalmente como parte da minha biblioteca existente.

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

e quando eu realmente quiser executar uma condição if semelhante à sua, criaria um objeto com uma lista dos valores válidos:

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

Não é tão rápido quanto uma declaração switch / case e é um pouco mais detalhado do que alguns dos outros exemplos, mas geralmente recebo a reutilização do objeto em outras partes do código, o que pode ser bastante útil.

Pegando carona em uma das amostras jsperf feitas acima, adicionei este teste e uma variação para comparar velocidades. http://jsperf.com/if-statements-test-techsin/6 A coisa mais interessante que notei é que certos combos de teste no Firefox são muito mais rápidos que o Chrome.

Isso pode ser resolvido com um simples loop for:

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

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

Usamos a primeira seção do loop for para inicializar os argumentos que você deseja corresponder, a segunda seção para interromper a execução do loop for e a terceira seção para fazer com que o loop saia eventualmente.