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?

Web_Designer
la source

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
Brad Christie
la source
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;
Adam Rackis
la source
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.

Tadeck
la source
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.

Daniel
la source
2
startingNum = startingNum || 1

Si vous avez une condition avec null, comme

startingNum = startingNum ? startingNum : null

vous pouvez utiliser '&&'

startingNum = startingNum && startingNum
a2441918
la source
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.

John Pace
la source
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"
xxjjnn
la source
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