¿Cómo escribir una declaración IF en línea en JavaScript?

286

¿Cómo puedo usar una línea if declaración en en JavaScript? ¿Hay una elsedeclaración en línea también?

Algo como esto:

var a = 2;
var b = 3;

if(a < b) {
    // do something
}
tómalo con calma
fuente
12
¿Dónde está el jQuery aquí? Y realmente no entiendo la pregunta de todos modos.
Marc
La parte jquery podría ser así $ (document) .ready (function () {var a = 2; var b = 3; if (a <b) {// haz algo}});
takeItEasy
es una cuestión demasiado knockoutjs
Martin Capodici
1
También es un angular 1 y 2 y cualquier otro marco js (incluido vanilla.js) pregunta por ahí
Ben Taliadoros

Respuestas:

641

No necesariamente necesitas jQuery. JavaScript solo hará esto.

var a = 2;
var b = 3;    
var c = ((a < b) ? 'minor' : 'major');

La cvariable será minorsi el valor es true, y majorsi el valor es false.


Esto se conoce como operador condicional (ternario).

https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Operators/Conditional_Operator

MattW
fuente
59
Ilustra cómo usar un IF en línea, que responde la pregunta EXACTAMENTE.
MattW
26
Solo para tener en cuenta, todos los padres en este caso son opcionales. A menudo es el estilo de preferencia / codificación personal lo que dicta cuándo se usan.
Will Klein
3
@khany, esta es una pregunta de JavaScript. Las expresiones pueden evaluar en otros idiomas de manera diferente.
Will Klein
1
@MattW Esto no muestra cómo usar un IF en línea, muestra cómo usar un IF SI
Finlay Percy
1
@getName no es realmente, pero podría usar una línea si la declaración si quisieraif (a < b) c = 'major';
MattW
44

Para escribir una ifdeclaración en línea, el código dentro de ella solo debe ser una declaración:

if ( a < b ) // code to be executed without curly braces;
indefinido
fuente
43

Hay un operador ternario, como este:

var c = (a < b) ? "a is less than b"  : "a is not less than b";
Mahmoud Gamal
fuente
44
En realidad no tiene que asignarse a nada. Los elementos del lado derecho pueden ser simplemente llamadas a funciones.
jfriend00
77
Ni siquiera tienen que ser llamadas a funciones ... 0 < 1 : 5 : 120;es una declaración perfectamente válida. Sin embargo, un poco inútil a menos que le paguen por línea.
Ry-
Ok, @ jfriend00, minitech, gracias por los consejos.
Mahmoud Gamal
@ jfriend00 Sin embargo, recomendaría no hacerlo en casi todos los casos. Si no está utilizando el valor de la expresión, entonces lo que realmente quiere son los efectos secundarios; y los efectos secundarios es para lo que las declaraciones son excelentes. El uso de la simple y aburrida ifdeclaración en tal caso probablemente hará que su código sea mucho más fácil de leer y comprender, y menos probable que se rompa con los cambios posteriores.
Emil Lundberg
35

También puede aproximar un if / else utilizando solo operadores lógicos.

(a && b) || c

Lo anterior es más o menos lo mismo que decir:

a ? b : c

Y, por supuesto, más o menos lo mismo que:

if ( a ) { b } else { c }

Digo más o menos porque hay una diferencia con este enfoque, ya que debes saber que el valor de bse evaluará como verdadero, de lo contrario siempre lo obtendrás c. Básicamente, debes darte cuenta de que la parte que aparecerá if () { here }ahora es parte de la condición que colocas if ( here ) { }.

Lo anterior es posible debido al comportamiento de JavaScripts de pasar / devolver uno de los valores originales que formaron la expresión lógica, que depende del tipo de operador. Ciertos otros lenguajes, como PHP, llevan el resultado real de la operación, es decir, verdadero o falso, lo que significa que el resultado es siempre verdadero o falso; p.ej:

14 && 0          /// results as 0,  not false
14 || 0          /// results as 14, not true
1 && 2 && 3 && 4 /// results as 4,  not true
true && ''       /// results as ''
{} || '0'        /// results as {}

Un beneficio principal, en comparación con una declaración if normal, es que los dos primeros métodos pueden operar en el lado derecho de un argumento, es decir, como parte de una asignación.

d = (a && b) || c;
d = a ? b : c;

if `a == true` then `d = b` else `d = c`

La única forma de lograr esto con un estándar si la declaración sería duplicar la asignación:

if ( a ) { d = b } else { d = c }

Puede preguntar por qué usar solo Operadores lógicos en lugar del Operador ternario , para casos simples que probablemente no haría, a menos que quisiera asegurarse ay bambos fueran ciertos. También puede lograr condiciones complejas más simplificadas con los operadores lógicos, que pueden volverse bastante desordenados mediante operaciones ternarias anidadas ... de nuevo, si desea que su código sea fácilmente legible, ninguno de los dos es realmente tan intuitivo.

Pebbl
fuente
32

En inglés simple, la sintaxis explicaba:

if(condition){
    do_something_if_condition_is_met;
}
else{
    do_something_else_if_condition_is_not_met;
}

Se puede escribir como:

condition ? do_something_if_condition_is_met : do_something_else_if_condition_is_not_met;
Onimusha
fuente
55
¿Es posible hacer esto sin la declaración "else"? es decir,condition ? true
abogado del diablo
@ScottBeeson Claro. También depende de su uso de la condición. true falsey ""todo debería estar bien para ignorar la parte else.
Onimusha
Entonces 2 == 2 ? doSomething()sería lo mismo que if (2 == 2) doSomething()?
Devil's Advocate
1
Sí, pero la parte else no se puede omitir por completo. Al menos : falseo : ""debería estar allí, ya que JavaScript espera esto.
Onimusha
55
Oh. Por lo tanto, no es posible hacerlo sin la declaración else.
Devil's Advocate
21
<div id="ABLAHALAHOO">8008</div>
<div id="WABOOLAWADO">1110</div>

parseInt( $( '#ABLAHALAHOO' ).text()) > parseInt( $( '#WABOOLAWADO ).text()) ? alert( 'Eat potato' ) : alert( 'You starve' );
HyderA
fuente
48
Ni siquiera sé lo que acabo de leer, pero me estoy riendo bastante fuerte.
Jazz
20

Si solo desea un IF en línea (sin ELSE), puede usar el operador lógico AND:

(a < b) && /*your code*/;

Si también necesita un ELSE, use la operación ternaria que sugirieron las otras personas.

Nahn
fuente
17

Puedes hacer esto en JavaScript:

a < b ? passed() : failed();
Ivar
fuente
8

Para su información, puede componer operadores condicionales

var a = (truthy) ? 1 : (falsy) ? 2 : 3;

Si su lógica es lo suficientemente compleja, entonces podría considerar usar un IIFE

var a = (function () {
  if (truthy) return 1;
  else if (falsy) return 2;
  return 3;
})();

Por supuesto, si planea usar esta lógica más de una vez, entonces debe encapsularla en una función para mantener las cosas agradables y SECAS.

alan
fuente
6

A menudo necesito ejecutar más código por condición, usando: ( , , )múltiples elementos de código pueden ejecutar:

var a = 2;
var b = 3;
var c = 0;

( a < b ?  ( alert('hi'), a=3, b=2, c=a*b ) : ( alert('by'), a=4, b=10, c=a/b ) );
kurt
fuente
4

Para agregar a esto también puede usar en línea si la condición con && y || operadores. Me gusta esto

var a = 2;
var b = 0;

var c = (a > b || b == 0)? "do something" : "do something else";
Anoop
fuente
0

No es la pregunta esencialmente: ¿puedo escribir lo siguiente?

if (foo)
  console.log(bar)
else
  console.log(foo + bar)

la respuesta es sí, lo anterior se traducirá.

sin embargo, tenga cuidado de hacer lo siguiente

if (foo)
  if (bar)
    console.log(foo)
  else 
    console.log(bar)
else 
  console.log(foobar)

asegúrese de incluir código ambiguo entre llaves, ya que lo anterior generará una excepción (y permutaciones similares producirán un comportamiento no deseado).

Jay Edwards
fuente
0

en línea si:

(('hypothesis') ? 'truthy conclusion' : 'falsey conclusion')

conclusión verdadera: declaraciones ejecutadas cuando la hipótesis es verdadera

conclusión falsey: declaraciones ejecutadas cuando la hipótesis es falsa

tu ejemplo:

var c = ((a < b) ? 'a<b statements' : '!(a<b) statements');
Sammy
fuente