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

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


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;

43

Hay un operador ternario, como este:

var c = (a < b) ? "a is less than b"  : "a is not less than b";

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.


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;

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

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.


17

Puedes hacer esto en JavaScript:

a < b ? passed() : failed();

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.


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

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

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).


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');
Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.