Sunday, October 20, 2019
Else Statements
The JavaScript Ternary Operator as a Shortcut for If/Else Statements The conditional ternary operator in JavaScript assigns a value to a variable based on some condition and is the only JavaScript operator that takes three operands. The ternary operator is a substitute for an if statementà in which both the if and else clauses assign different values to the same field, like so: if (condition)result something;elseresult somethingelse; The ternary operator shortens this if/else statement into a single statement: result (condition) ? something : somethingelse; If condition is true, the ternary operator returns the value of the first expression; otherwise, it returns the value of the second expression. Lets consider its parts:à First, create the variable to which you want to assign a value, in this case, result. The variable result will have a different value depending on the condition.Note that on the right-hand side (i.e. the operator itself), the condition is first.The condition is always followed by a question mark (?), which can basically be read as was that true?The two possible results come last, separated by a colon (:). This use of the ternary operator is available only when the original if statement follows the format shown aboveà - butà this is quite a common scenario, and using the ternary operator can be far more efficient. Ternary Operator Example Lets look at a real example. Perhaps you need to determine which children are the right age to attend kindergarten. You might have a conditional statement like this: var age 7;var kindergarten_eligible;à if (ageà 5) {kindergarten_eligible Old enough;}else {kindergarten_eligible Too young;} Using the ternary operator, you could shorten the expressionà to: varà kindergarten_eligible (age 5) ?à Too youngà :à Old enough; This example would, of course, return Old enough. Multiple Evaluations You can include multiple evaluations, as well: var age 7, var socially_ready true;var kindergarten_eligible (age 5) ? Too youngà : socially_readyOld enough but not yet ready Old and socially mature enoughconsole.log ( kindergarten_eligible ); // logs Old and socially mature enoughà Multiple Operations The ternary operator also allows the inclusion of multiple operations for each expression, separated by a comma: var ageà 7, socially_ready true; age 5à ? (alert(You are old enough.),location.assign(continue.html)) : (socially_ready false,alert(Sorry, but you are not yet ready.)); Ternary Operator Implications Ternary operators avoid otherwise verbose code, so on the one hand, they appearà desirable. On the other hand, they can compromise readabilityà - obviously, IF ELSE is more easily understood than a cryptic ?. When using a ternary operatorà - à à or any abbreviationà à - à consider who will be reading your code. If less-experienced developers may need to understand your program logic, perhaps the use of the ternary operator should be avoided. This is especially true if your condition and evaluations are complex enough that you would need to nest or chain your ternary operator. In fact, these kinds of nested operators can impact not only readability but debugging. As with any programming decision, be sure to consider context and usability before using a ternary operator.
Subscribe to:
Post Comments (Atom)
No comments:
Post a Comment
Note: Only a member of this blog may post a comment.