Short-circuiting in JavaScript

Ever heard of short-circuiting in JavaScript? It’s not something strange, believe me. You might have even interacted with some parts of it at one point. Well, short-circuiting is a way of simplifying conditionals while making code more readable. In mos…


This content originally appeared on DEV Community and was authored by Susan Wangari

Ever heard of short-circuiting in JavaScript? It's not something strange, believe me. You might have even interacted with some parts of it at one point. Well, short-circuiting is a way of simplifying conditionals while making code more readable. In most cases, short-circuiting is utilized in place of if-else expressions. It can be used for both single and multiple if-else statements.

There are various operators used in short-circuiting. They include OR and AND. OR which is denoted by || is used to test a single condition. If one condition is right, then the code executes successfully. Check out the example below;


const response = "Foo";
const username = response || "guest";
console.log(username);

The code above checks if there is a response. If there is one, it returns the response. If not, it returns guest as the username.

AND which is denoted by && is used to test for multiple conditions. For the code to run, all of the requirements must be met. Look at the following illustration;


const response = "Foo";
const isEmailVerified = true;
const username = isEmailVerified && response ;
console.log(username);

This code evaluates when there is a response and the email is verified.
Both AND and OR operators can be used in one operation. For example;


const response = "Foo";
const isEmailVerified = true;
const username = isEmailVerified && response || "guest";
console.log(username);

In such a scenario, the AND is executed before the OR.
There is a technique to 'override' this and allow the OR to run first. This is accomplished by the use of parenthesis. Which operators are run first are specified by parentheses. Here is an example;


const response = "Foo";
const isEmailVerified = true;
const username = isEmailVerified && (response || "guest");
console.log(username);

In this case, the OR is executed before the AND operator.

In conclusion, short-circuiting should not be used as a way to shorten code but as a way to make code more readable.


This content originally appeared on DEV Community and was authored by Susan Wangari


Print Share Comment Cite Upload Translate Updates
APA

Susan Wangari | Sciencx (2022-04-15T17:36:26+00:00) Short-circuiting in JavaScript. Retrieved from https://www.scien.cx/2022/04/15/short-circuiting-in-javascript/

MLA
" » Short-circuiting in JavaScript." Susan Wangari | Sciencx - Friday April 15, 2022, https://www.scien.cx/2022/04/15/short-circuiting-in-javascript/
HARVARD
Susan Wangari | Sciencx Friday April 15, 2022 » Short-circuiting in JavaScript., viewed ,<https://www.scien.cx/2022/04/15/short-circuiting-in-javascript/>
VANCOUVER
Susan Wangari | Sciencx - » Short-circuiting in JavaScript. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2022/04/15/short-circuiting-in-javascript/
CHICAGO
" » Short-circuiting in JavaScript." Susan Wangari | Sciencx - Accessed . https://www.scien.cx/2022/04/15/short-circuiting-in-javascript/
IEEE
" » Short-circuiting in JavaScript." Susan Wangari | Sciencx [Online]. Available: https://www.scien.cx/2022/04/15/short-circuiting-in-javascript/. [Accessed: ]
rf:citation
» Short-circuiting in JavaScript | Susan Wangari | Sciencx | https://www.scien.cx/2022/04/15/short-circuiting-in-javascript/ |

Please log in to upload a file.




There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.