Opérateur ternaire abrégé Javascript


102

Je sais que dans php 5.3 au lieu d'utiliser cette syntaxe d'opérateur ternaire redondante:

startingNum = startingNum ? startingNum : 1

... nous pouvons utiliser une syntaxe abrégée pour nos opérateurs ternaires le cas échéant:

startingNum = startingNum ?: 1

Et je connais l'opérateur ternaire en javascript:

startingNum = startingNum ? startingNum : 1

... mais y a-t-il une sténographie?

Réponses:


177
var startingNumber = startingNumber || 1;

Quelque chose comme ça ce que vous cherchez, où est-il par défaut s'il n'est pas défini?

var foo = bar || 1; // 1
var bar = 2;
foo = bar || 1;     // 2

À propos, cela fonctionne pour de nombreux scénarios, y compris des objets:

var foo = bar || {}; // secure an object is assigned when bar is absent

En effet, rebondi ce matin. Corrigé, mais merci de l'avoir remarqué.
Brad Christie

1
Tu ne veux pas dire ||au lieu de ???
Rocket Hazmat

2
Merci! Vous avez réussi. J'utilise en fait un objet dans ce cas. :)
Web_Designer

8
Pour toute personne curieuse, cela fonctionne parce que l' ||opérateur de JS ne renvoie ni vrai ni faux, il renvoie la première valeur «véridique». Dites que vous avez val0et val1comme undefined, et val2est 2, val3est 3. val0 || val1 || val2 || val3reviendra 2, car c'est la première valeur de «vérité».
Jake T.

2
Ce langage n'est-il pas un anti-modèle? Que faire si vous passez 0 ou une chaîne vide, l'expression «OU» l'ignorera et utilisera la valeur par défaut là où vous vouliez réellement 0 ou une chaîne vide.
Paul Trzyna

24

|| retournera la première valeur de vérité qu'il rencontre, et peut donc être utilisé comme opérateur de fusion, similaire à C # ??

startingNum = startingNum || 1;

J'aime votre explication plus que les autres
ajax333221

12

Oui il y a:

var startingNum = startingNum || 1;

En général, expr1 || expr2fonctionne de la manière suivante (comme mentionné dans la documentation ):

Renvoie expr1s'il peut être converti en true; sinon, retourne expr2. Ainsi, lorsqu'il est utilisé avec des Booleanvaleurs, ||renvoie truesi l'un des opérandes est true; si les deux le sont false, retourne false.


N'est-il pas plus correct de dire if a is truthyvs. if a is evaluated to true?
JaredPar

3
@JaredPar: Pour éviter toute ambiguïté, j'ai remplacé mon explication détaillée originale par celle de Mozilla Developer Network. Cela devrait être moins ambigu.
Tadeck

2
var startingNum = startingNum || 1;

Dans ce cas, vous pouvez utiliser l'opérateur OR.


2
startingNum = startingNum || 1

Si vous avez une condition avec null, comme

startingNum = startingNum ? startingNum : null

vous pouvez utiliser '&&'

startingNum = startingNum && startingNum

Mais ne sera pas anything && nullévalué à null à moins qu'il ne anythingsoit faux?
Petruza

Ouais, si quelque chose est véridique, il est évalué à null. Si c'est faux, évalue à la valeur
falsifiée

1

Les réponses ci-dessus sont correctes. En JavaScript, la déclaration suivante:

startingNum = startingNum ? otherNum : 1

peut être exprimé comme

startingNum = otherNum || 1

Un autre scénario non couvert ici est si vous souhaitez que la valeur renvoie false lorsqu'elle ne correspond pas. Le raccourci JavaScript pour cela est:

startingNum = startingNum ? otherNum : 0

Mais cela peut être exprimé comme

startingNum = startingNum && otherNum

Je voulais juste couvrir un autre scénario au cas où d'autres rechercheraient une réponse plus générale.


y a-t-il un raccourci pour quelque chose comme ça: x = innerWidth * 0.0375 > 24 ? innerWidth * 0.0375 : 24???
oldboy

@Anthony Non, car innerWidth * 0.0375 > 24diffère de la if truepartie qui est innerWidth * 0.0375. Le raccourci ne peut être utilisé que si les expression to be evaluatedet les if trueont la même valeur. Même pourquoi vous ne seriez pas capable de sténographier x = someBoolean ? 'Heck yea!' : 'No way!'.
deedub

@deedub eh bien, en fait, il y a un "raccourci" (si vous l'appelez ainsi) qui seraitMath.max(innerWidth * 0.0375, 24)
oldboy

@Anthony Vous ne l'appelleriez pas ainsi;) Mais Math.maxfonctionne mieux qu'un opérateur ternaire dans votre cas d'utilisation.
deedub

1
" startingNum = startingNum ? otherNum : 1peut être exprimé par startingNum = otherNum || 1" est faux. je viens de tester ceci
oldboy

0

Pour faire un ternaire comme:

boolean_condition ? true_result : false_result

en javascript, vous pouvez faire:

(boolean_condition && true_result ) || false_result;

Exemple:

(true && 'green') || 'red';
=> "green"
(false && 'green') || 'red';
=> "red"

sooo x = innerWidth * 0.0375 > 24 ? innerWidth * 0.0375 : 24deviendrait (innerWidth * 0.0375 > 24 && innerWidth * 0.0375) || 24?? y a-t-il un raccourci, de sorte que je n'ai pas à répéter innerWidth * 0.0375, autre que l'assigner à une variable ???
oldboy

1
Dans ce cas, Math.max( innerWidth * 0.0375 , 24 )fonctionnerait avec élégance. Pour un cas plus général, il serait bon de créer une méthode descriptive appelée par exemple «somethingifiedInnerWidth» qui améliore la lisibilité, plutôt que de créer une variable. Bien que dans certains cas, il serait plus lisible d'avoir une variable (de ce nom descriptif), alors à l'avenir la question «pourquoi est-elle multipliée par ceci? n'est pas soulevé.
xxjjnn

wow ne savais même pas que tu pouvais fournir un deuxième argument pour Math.max . solution super élégante !!
oldboy
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.