Operador condicional (ternario)

Baseline Widely available

This feature is well established and works across many devices and browser versions. Its been available across browsers since julio de 2015.

Learn more
See full compatibility

El operador condicional (ternario) es el nico operador en JavaScript que tiene tres operandos. Este operador se usa con frecuencia como atajo para la instruccin if.

Sintaxis

condicin ? expr1 : expr2

Parmetros

condicin: Una expresin que se evala como true o false.
expr1, expr2: Expresin con valores de algn tipo.

Si la condicin es true, el operador retorna el valor de la expr1; de lo contrario, devuelve el valor de expr2. Por ejemplo, para mostrar un mensaje diferente en funcin del valor de la variable isMember, se puede usar esta declaracin:

"La Cuota es de:  " + (isMember ? "$2.00" : "$10.00");

Tambin puedes asignar variables dependiendo del resultado de la condicin ternaria:

var elvisLives = Math.PI > 4 ? "Sip" : "Nop";

Tambin es posible realizar evaluaciones ternarias mltiples (Nota: El operador condicional es asociativo):

var firstCheck = false,
  secondCheck = false,
  access = firstCheck
    ? "Acceso Denegado"
    : secondCheck
      ? "Acceso Denegado"
      : "Acceso Permitido";

console.log(access); // muestra "Acceso Permitido"

Tambin puede usar operaciones ternarias en espacio vaco con el propsito de realizar diferentes operaciones:

var stop = false,
  age = 16;

age > 18 ? location.assign("continue.html") : (stop = true);

Tambin puede realizar ms de una operacin por caso, separndolas con una coma:

var stop = false,
  age = 23;

age > 18
  ? (alert("OK, puedes continuar."), location.assign("continue.html"))
  : ((stop = true), alert("Disculpa, eres menor de edad!"));

Tambin puede realizar ms de una operacin durante la asignacin de un valor. En este caso, el ltimo valor separado por una coma del parntesis ser el valor asignado.

var age = 16;

var url =
  age > 18
    ? (alert("OK, puedes continuar."),
      // alert devuelve "undefined", pero ser ignorado porque
      // no es el ltimo valor separado por comas del parntesis
      "continue.html") // el valor a ser asignado si age > 18
    : (alert("Eres menor de edad!"),
      alert("Disculpa :-("),
      // etc. etc.
      "stop.html"); // el valor a ser asignado si !(age > 18)

location.assign(url); // "stop.html"