tab - Javascript una línea Si... más... otra cosa si declaración

title html

Question

Sé que puede establecer variables con una línea si / else sentencias haciendo var variable = (condition) ? (true block) : (else block) var variable = (condition) ? (true block) : (else block) , pero me preguntaba si había una manera de poner una declaración else if allí. Cualquier sugerencia sería apreciada, gracias a todos!

Answer 1

tl; dr

Sí, puede ... Si a entonces a, si no b entonces si c entonces c (b), b, si no null

a ? a : (b ? (c ? c(b) : b) : null)

a
  ? a
  : b
      ? c
        ? c(b)
        : b
      : null

versión más larga

?: Operador ternario ?: Usado como inline si-else es asociativo correcto . En resumen, esto significa que el más a la derecha ? se alimenta primero y toma exactamente un operando más cercano a la izquierda y dos , con a : a la derecha.

Hablando en términos prácticos, considere la siguiente declaración (igual a la anterior) :

a ? a : b ? c ? c(b) : b : null

¿El más a la derecha ? ¿Se alimenta primero, así que encuéntrelo y sus tres argumentos circundantes y expanda consecutivamente a la izquierda a otro ? .

   a ? a : b ? c ? c(b) : b : null
                 ^                  <---- RTL
1.            |1-?-2----:-3|
             ^ <-
2.        |1-?|--2---------|:-3---|
     ^ <-
3.|1-?-2-:|--3--------------------|

result: a ? a : (b ? (c ? c(b) : b) : null)

Así es como las computadoras lo leen:

1. Se lee el termino a
   Nodo: a
2. No terminal ? es leído.
   Nodo: a ?
3. Se lee el termino a
   Nodo: a ? a a ? a
4. No terminal : se lee.
   Nodo: a ? a : a ? a :
5. Se lee el término b .
   Nodo: a ? a : b a ? a : b
6. No terminal ? Se lee, activando la regla de asociatividad derecha. La asociatividad decide:
   nodo: a ? a : (b ? a ? a : (b ?
7. Se lee el termino c
   Nodo: a ? a : (b ? c a ? a : (b ? c
8. No terminal ? Se lee, volviendo a aplicar la regla de asociatividad derecha.
   Nodo: a ? a : (b ? (c ? a ? a : (b ? (c ?
9. Se lee el término c(b) .
   Nodo: a ? a : (b ? (c ? c(b) a ? a : (b ? (c ? c(b)
10. No terminal : se lee.
    Nodo: a ? a : (b ? (c ? c(b) : a ? a : (b ? (c ? c(b) :
11. Se lee el término b .
    Nodo: a ? a : (b ? (c ? c(b) : b a ? a : (b ? (c ? c(b) : b
12. No terminal : se lee. ¿El operador ternario ?: Del alcance anterior se satisface y el alcance se cierra.
    Nodo: a ? a : (b ? (c ? c(b) : b) : a ? a : (b ? (c ? c(b) : b) :
13. Se lee el término null .
    Nodo: a ? a : (b ? (c ? c(b) : b) : null a ? a : (b ? (c ? c(b) : b) : null
14. No hay tokens para leer. Cierre el paréntesis abierto restante.

    El resultado es: a ? a : (b ? (c ? c(b) : b) : null) a ? a : (b ? (c ? c(b) : b) : null)

Mejor legibilidad

El oneliner feo de arriba podría (y debería) reescribirse para facilitar su lectura como:
(Tenga en cuenta que la sangría no define implícitamente los cierres correctos como lo hacen los paréntesis ()).

a
  ? a
  : b
      ? c
        ? c(b)
        : b
      : null

por ejemplo

return a + some_lengthy_variable_name > another_variable
        ? "yep"
        : "nop"

Más lectura

Mozilla: operador condicional de JavaScript
Wiki: asociatividad de operadores

Bonus: Operadores logicos

var a = 0 // 1
var b = 20
var c = null // x=> {console.log(''b is'', x); return true} // return true here!

a
  && a
  || b
      && c
        && c(b) // if this returns false, || b is processed
        || b
      || null

Usar operadores lógicos como en este ejemplo es feo e incorrecto, pero aquí es donde brillan ...

"Nula coalescencia"

function(mayBeNull) {
  var cantBeNull = mayBeNull || 42             // "default" value
  var alsoCantBe = mayBeNull ? mayBeNull : 42  // ugly...
  ..
}

Evaluación de cortocircuito

false && (anything) // is short-circuit evaluated to false.
true || (anything)  // is short-circuit evaluated to true.

Operadores logicos
Coalescencia nula
Evaluación de cortocircuito

Answer 2

Claro, puedes hacer operadores ternarios anidados pero son difíciles de leer.

var variable = (condition) ? (true block) : ((condition2) ? (true block2) : (else block2))

Answer 3

En palabras simples:

var x = (day == "yes") ? "Good Day!" : (day == "no") ? "Good Night!";

Answer 4

Esto se usa principalmente para asignar variables, y usa el condicionamiento binomial, por ejemplo.

var time = Date().getHours(); // or something

var clockTime = time > 12 ? ''PM'' : ''AM'' ;

No hay ElseIf, por el bien del desarrollo no use el encadenamiento, puede usar el switch que es mucho más rápido si tiene múltiples condicionamientos en .js

Answer 5

Puedes encadenar tantas condiciones como quieras. Si lo haces:

var x = (false)?("1true"):((true)?"2true":"2false");

Obtendrá x="2true"

Por lo que podría expresarse como:

var variable = (condition) ? (true block) : ((condition)?(true block):(false block))

Answer 6

Sé que este es un hilo viejo, pero pensé que habría puesto mis dos centavos. Los operadores ternarios pueden ser anidados de la siguiente manera:

var variable = conditionA ? valueA : (conditionB ? valueB: (conditionC ? valueC : valueD));

Ejemplo:

var answer = value === ''foo'' ? 1 :
    (value === ''bar'' ? 2 : 
        (value === ''foobar'' ? 3 : 0));