JavaScript
Condiciones

Introducción

Sintaxis

• declaración if ( condición );
• if ( condicion ) sentencia_1 , sentencia_2 , ... , sentencia_n ;
• if ( condición ) {
  declaración
  }
• if ( condición ) {
  statement_1 ;
  sentencia_2 ;
  ...
  statement_n ;
  }
• if ( condición ) {
  declaración
  } else {
  declaración
  }
• if ( condición ) {
  declaración
  } else if ( condición ) {
  declaración
  } else {
  declaración
  }
• interruptor ( expresión ) {
  valor de caso1 :
  declaración
  [descanso;]
  valor de caso2 :
  declaración
  [descanso;]
  valor de casoN :
  declaración
  [descanso;]
  defecto:
  declaración
  [descanso;]
  }
• condición ? value_for_true : value_for_false ;

Observaciones

Si / Else Si / Else Control

En su forma más simple, una condición if se puede usar así:

var i = 0;

if (i < 1) {
    console.log("i is smaller than 1");
}

La condición i < 1 se evalúa, y si se evalúa como true se ejecuta el bloque que sigue. Si se evalúa como false , el bloque se omite.

Una condición if puede expandirse con un bloque else . La condición se verifica una vez como se indicó anteriormente, y si se evalúa como false , se ejecutará un bloque secundario (que se omitiría si la condición fuera true ). Un ejemplo:

if (i < 1) {
    console.log("i is smaller than 1");
} else {
    console.log("i was not smaller than 1");
}

Suponiendo que el bloque else no contiene más que otro bloque if (con opcionalmente un bloque else ) como este:

if (i < 1) {
    console.log("i is smaller than 1");
} else {
    if (i < 2) {
        console.log("i is smaller than 2");
    } else {
        console.log("none of the previous conditions was true");
    }
}

Luego también hay una forma diferente de escribir esto que reduce el anidamiento:

if (i < 1) {
    console.log("i is smaller than 1");
} else if (i < 2) {
    console.log("i is smaller than 2");
} else {
    console.log("none of the previous conditions was true");
}

Algunas notas importantes sobre los ejemplos anteriores:

• Si alguna condición se evalúa como true , no se evaluará ninguna otra condición en esa cadena de bloques y no se ejecutarán todos los bloques correspondientes (incluido el bloque else ).

• El número de else if partes es prácticamente ilimitada. El último ejemplo anterior solo contiene uno, pero puedes tener tantos como quieras.

• La condición dentro de una sentencia if puede ser cualquier cosa que pueda ser forzada a un valor booleano, consulte el tema sobre lógica booleana para obtener más detalles;

• La escalera if-else-if sale en el primer éxito. Es decir, en el ejemplo anterior, si el valor de i es 0.5, entonces se ejecuta la primera rama. Si las condiciones se superponen, se ejecutan los primeros criterios que se producen en el flujo de ejecución. La otra condición, que también podría ser cierta, se ignora.

• Si solo tiene una declaración, las llaves alrededor de esa declaración son técnicamente opcionales, por ejemplo, esto está bien:

  if (i < 1) console.log("i is smaller than 1");
  

  Y esto funcionará también:

  if (i < 1) 
      console.log("i is smaller than 1");
  

  Si desea ejecutar varias declaraciones dentro de un bloque if , entonces las llaves que las rodean son obligatorias. Sólo usar sangría no es suficiente. Por ejemplo, el siguiente código:

  if (i < 1) 
      console.log("i is smaller than 1");
      console.log("this will run REGARDLESS of the condition"); // Warning, see text!
  

  es equivalente a:

  if (i < 1) {
      console.log("i is smaller than 1");
  }
  console.log("this will run REGARDLESS of the condition");
  

Cambiar la declaración

Las instrucciones de conmutación comparan el valor de una expresión con 1 o más valores y ejecutan diferentes secciones de código basadas en esa comparación.

var value = 1;
switch (value) {
  case 1:
    console.log('I will always run');
    break;
  case 2:
    console.log('I will never run');
    break;
}

La instrucción break "rompe" fuera de la instrucción switch y garantiza que no se ejecute más código dentro de la instrucción switch. Así es como se definen las secciones y le permite al usuario hacer casos de "caída".

Advertencia : la falta de una declaración de break o return para cada caso significa que el programa continuará evaluando el próximo caso, ¡incluso si el criterio del caso no se cumple!

switch (value) {
  case 1:
    console.log('I will only run if value === 1');
    // Here, the code "falls through" and will run the code under case 2
  case 2:
    console.log('I will run if value === 1 or value === 2');
    break;
  case 3:
    console.log('I will only run if value === 3');
    break;
}

El último caso es el caso por default . Éste se ejecutará si no se hicieron otros partidos.

var animal = 'Lion';
switch (animal) {
  case 'Dog':
    console.log('I will not run since animal !== "Dog"');
    break;
  case 'Cat':
    console.log('I will not run since animal !== "Cat"');
    break;
  default:
    console.log('I will run since animal does not match any other case');
}

Cabe señalar que una expresión de caso puede ser cualquier tipo de expresión. Esto significa que puede usar comparaciones, llamadas a funciones, etc. como valores de caso.

function john() {
  return 'John';
}

function jacob() {
  return 'Jacob';
}

switch (name) {
  case john(): // Compare name with the return value of john() (name == "John")
    console.log('I will run if name === "John"');
    break;
  case 'Ja' + 'ne': // Concatenate the strings together then compare (name == "Jane")
    console.log('I will run if name === "Jane"');
    break;
  case john() + ' ' + jacob() + ' Jingleheimer Schmidt':
    console.log('His name is equal to name too!');
    break;
}

Criterios de inclusión múltiple para casos

Ya que los casos "no llegan" sin una declaración de break o return , puede usar esto para crear múltiples criterios inclusivos:

var x = "c"
switch (x) {
   case "a":
   case "b":
   case "c":
      console.log("Either a, b, or c was selected.");
      break;
   case "d":
      console.log("Only d was selected.");
      break;
   default:
      console.log("No case was matched.");
      break;  // precautionary break if case order changes
}

Operadores ternarios

Se puede utilizar para acortar las operaciones if / else. Esto es útil para devolver un valor rápidamente (es decir, para asignarlo a otra variable).

Por ejemplo:

var animal = 'kitty';
var result = (animal === 'kitty') ? 'cute' : 'still nice';

En este caso, el result obtiene el valor 'lindo', porque el valor del animal es 'gatito'. Si el animal tuviera otro valor, el resultado obtendría el valor "todavía agradable".

Compare esto con lo que le gustaría al código if/else condiciona.

var animal = 'kitty';
var result = '';
if (animal === 'kitty') {
    result = 'cute';
} else {
    result = 'still nice';
}

Las condiciones if o else pueden tener varias operaciones. En este caso, el operador devuelve el resultado de la última expresión.

var a = 0;
var str = 'not a';
var b = '';
b = a === 0 ? (a = 1, str += ' test') : (a = 2);

Debido a que a era igual a 0, se convierte en 1 y str convierte en 'no una prueba'. La operación que involucró a str fue la última, por lo que b recibe el resultado de la operación, que es el valor contenido en str , es decir, "no es una prueba".

Los operadores ternarios siempre esperan otras condiciones, de lo contrario obtendrá un error de sintaxis. Como solución alternativa, podría devolver un cero algo similar en la rama else: esto no importa si no está utilizando el valor de retorno, sino simplemente acortando (o intentando acortar) la operación.

var a = 1;
a === 1 ? alert('Hey, it is 1!') : 0;

Como ve, if (a === 1) alert('Hey, it is 1!'); Haría lo mismo. Sería sólo un carbón más tiempo, ya que no necesita una obligatoria else condiciones. Si se tratara de else condición, el método ternario sería mucho más limpio.

a === 1 ? alert('Hey, it is 1!') : alert('Weird, what could it be?');
if (a === 1) alert('Hey, it is 1!') else alert('Weird, what could it be?');

Los ternarios se pueden anidar para encapsular lógica adicional. Por ejemplo

foo ? bar ? 1 : 2 : 3

// To be clear, this is evaluated left to right 
// and can be more explicitly expressed as:

foo ? (bar ? 1 : 2) : 3

Esto es lo mismo que lo siguiente if/else

if (foo) {
  if (bar) {
    1
  } else {
    2
  }
} else {
  3
}

Estilísticamente, esto solo debe usarse con nombres cortos de variables, ya que los ternarios multilínea pueden disminuir drásticamente la legibilidad.

Las únicas declaraciones que no se pueden usar en los ternarios son las declaraciones de control. Por ejemplo, no puede usar return o break con ternaries. La siguiente expresión no será válida.

var animal = 'kitty';
for (var i = 0; i < 5; ++i) {
    (animal === 'kitty') ? break:console.log(i);
}

Para declaraciones de devolución, lo siguiente también sería inválido:

var animal = 'kitty';
(animal === 'kitty') ? return 'meow' : return 'woof';

Para hacer lo anterior correctamente, devolvería el ternario de la siguiente manera:

var animal = 'kitty';
return (animal === 'kitty') ? 'meow' : 'woof';

Estrategia

Un patrón de estrategia puede usarse en Javascript en muchos casos para reemplazar una declaración de cambio. Es especialmente útil cuando el número de condiciones es dinámico o muy grande. Permite que el código para cada condición sea independiente y se pueda probar por separado.

El objeto de estrategia es un objeto simple con múltiples funciones, que representa cada condición por separado. Ejemplo:

const AnimalSays = {
    dog () {
        return 'woof';
    },

    cat () {
        return 'meow';
    },

    lion () {
        return 'roar';
    },

    // ... other animals

    default () {
        return 'moo';
    }
};

El objeto anterior se puede utilizar de la siguiente manera:

function makeAnimalSpeak (animal) {
    // Match the animal by type
    const speak = AnimalSays[animal] || AnimalSays.default;
    console.log(animal + ' says ' + speak());
}

Resultados:

makeAnimalSpeak('dog') // => 'dog says woof'
makeAnimalSpeak('cat') // => 'cat says meow'
makeAnimalSpeak('lion') // => 'lion says roar'
makeAnimalSpeak('snake') // => 'snake says moo'

En el último caso, nuestra función por defecto maneja cualquier animal perdido.

Utilizando || y && cortocircuito

Los operadores booleanos || y && "cortocircuitará" y no evaluará el segundo parámetro si el primero es verdadero o falso respectivamente. Esto se puede usar para escribir condicionales cortos como:

var x = 10

x == 10 && alert("x is 10")
x == 10 || alert("x is not 10")