Skip to content
geeksforgeeks
  • Tutorials
    • Python
    • Java
    • Data Structures & Algorithms
    • ML & Data Science
    • Interview Corner
    • Programming Languages
    • Web Development
    • CS Subjects
    • DevOps And Linux
    • Software and Tools
    • School Learning
    • Practice Coding Problems
  • GfG Premium
  • JS Tutorial
  • JS Exercise
  • JS Interview Questions
  • JS Array
  • JS String
  • JS Object
  • JS Operator
  • JS Date
  • JS Error
  • JS Projects
  • JS Set
  • JS Map
  • JS RegExp
  • JS Math
  • JS Number
  • JS Boolean
  • JS Examples
  • JS Free JS Course
  • JS A to Z Guide
  • JS Formatter
Open In App
Next Article:
Difference between != and !== operator in JavaScript
Next article icon

Difference Between && and || Operators in javaScript

Last Updated : 12 Jul, 2024
Summarize
Comments
Improve
Suggest changes
Share
Like Article
Like
Report

In JavaScript, logical operators && (AND) and || (OR) are used to perform the logical operations on values. These operators are commonly used in the control flow and decision-making within the programs. Understanding the differences between these operators is essential for writing efficient and accurate code.

These are the following topics that we are going to discuss:

Table of Content

  • What is &&?
  • What is ||?
  • Difference Between && and || Operator

What is &&?

The && operator also known as the logical AND operator evaluates expressions from the left to right and returns the first falsy value encountered. If all values are truthy it returns the last value.

  • Returns true if both the operands are true.
  • Stops evaluation as the soon as it finds a falsy value.

Syntax:

condition1 && condition2

Example: This example shows the use of && operator.

JavaScript
let a = true;
let b = false;
console.log(a && b);
let c = 5;
let d = 10;
console.log(c < d && d > 0);

Output
false
true

What is ||?

The || operator also known as the logical OR operator evaluates expressions from the left to right and returns the first truthy value encountered. If all values are falsy it returns the last value.

  • Returns true if at least one operand is true.
  • Stops evaluation as the soon as it finds a truthy value.

Syntax:

condition1 || condition2

Example: This example shows the use of || operator.

JavaScript
let a = true;
let b = false;
console.log(a || b); 
let c = 0;
let d = 10;
console.log(c || d); 

Output
true
10

Difference Between && and || Operator

Characteristics

&& operator

|| operator

Evaluation

Stops at the first falsy value

Stops at the first truthy value

Returns

First falsy value or last value if all are truthy

First truthy value or last value if all are falsy

Use Case

Checking if all conditions are true

Checking if at least one condition is true

Short-circuiting

Yes

Yes

Truthy/Falsy Values

Returns the last truthy value if all are truthy

Returns the first truthy value

Common Application

Conditional statements and function calls

Default values fallback mechanisms

Conclusion

The && and || operators are powerful tools in JavaScript for controlling the flow of logic in the code. Understanding their differences and characteristics allows to use them effectively in the various programming scenarios. While && is useful for ensuring all conditions are met. || is ideal for the ensuring at least one condition is satisfied or providing the default values. Mastering these operators will enhance the ability to the write concise and efficient JavaScript code.


Next Article
Difference between != and !== operator in JavaScript

S

subramanyasmgm
Improve
Article Tags :
  • JavaScript
  • Web Technologies

Similar Reads

    Difference between != and !== operator in JavaScript
    != operatorThe inequality operator (!=) is the logical opposite of the equality operator. It means "Not Equal" and returns true whereas equality would return false and vice versa. Like the equality operator, the inequality operator will convert data types of values while comparing. For example 1 !=
    2 min read
    Difference Between == & === in JavaScript
    In JavaScript, comparison operators like == (double equals) and === (triple equals) are used to compare values, but they behave differently. The == operator is known as the loose equality operator. It compares two values for equality after performing type coercion, meaning it converts the values to
    3 min read
    Difference Between == & === in JavaScript
    In JavaScript, comparison operators like == (double equals) and === (triple equals) are used to compare values, but they behave differently. The == operator is known as the loose equality operator. It compares two values for equality after performing type coercion, meaning it converts the values to
    3 min read
    AND(&) Bitwise Operator in JavaScript
    JavaScript Bitwise AND(&) operator is used to compare two operands by performing an AND operation on the individual bits and returning 1 only if both the bits are one. The AND(&) Operator has a lot of real-world applications and the most famous one is to check whether a number is even or odd
    2 min read
    JavaScript in and instanceof operators
    JavaScript Relational Operators are used to compare their operands and determine the relationship between them. They return a Boolean value (true or false) based on the comparison result.JavaScript in OperatorThe in-operator in JavaScript checks if a specified property exists in an object or if an e
    3 min read
    What is the difference between every() and some() methods in JavaScript ?
    In this article, we will see the difference between every() and some() methods in JavaScript. Array.every() methodThe Array.every() method in JavaScript is used to check whether all the elements of the array satisfy the given condition or not. The output will be false if even one value does not sati
    3 min read
`; $(commentSectionTemplate).insertBefore(".article--recommended"); } loadComments(); }); }); function loadComments() { if ($("iframe[id*='discuss-iframe']").length top_of_element && top_of_screen articleRecommendedTop && top_of_screen articleRecommendedBottom)) { if (!isfollowingApiCall) { isfollowingApiCall = true; setTimeout(function(){ if (loginData && loginData.isLoggedIn) { if (loginData.userName !== $('#followAuthor').val()) { is_following(); } else { $('.profileCard-profile-picture').css('background-color', '#E7E7E7'); } } else { $('.follow-btn').removeClass('hideIt'); } }, 3000); } } }); } $(".accordion-header").click(function() { var arrowIcon = $(this).find('.bottom-arrow-icon'); arrowIcon.toggleClass('rotate180'); }); }); window.isReportArticle = false; function report_article(){ if (!loginData || !loginData.isLoggedIn) { const loginModalButton = $('.login-modal-btn') if (loginModalButton.length) { loginModalButton.click(); } return; } if(!window.isReportArticle){ //to add loader $('.report-loader').addClass('spinner'); jQuery('#report_modal_content').load(gfgSiteUrl+'wp-content/themes/iconic-one/report-modal.php', { PRACTICE_API_URL: practiceAPIURL, PRACTICE_URL:practiceURL },function(responseTxt, statusTxt, xhr){ if(statusTxt == "error"){ alert("Error: " + xhr.status + ": " + xhr.statusText); } }); }else{ window.scrollTo({ top: 0, behavior: 'smooth' }); $("#report_modal_content").show(); } } function closeShareModal() { const shareOption = document.querySelector('[data-gfg-action="share-article"]'); shareOption.classList.remove("hover_share_menu"); let shareModal = document.querySelector(".hover__share-modal-container"); shareModal && shareModal.remove(); } function openShareModal() { closeShareModal(); // Remove existing modal if any let shareModal = document.querySelector(".three_dot_dropdown_share"); shareModal.appendChild(Object.assign(document.createElement("div"), { className: "hover__share-modal-container" })); document.querySelector(".hover__share-modal-container").append( Object.assign(document.createElement('div'), { className: "share__modal" }), ); document.querySelector(".share__modal").append(Object.assign(document.createElement('h1'), { className: "share__modal-heading" }, { textContent: "Share to" })); const socialOptions = ["LinkedIn", "WhatsApp","Twitter", "Copy Link"]; socialOptions.forEach((socialOption) => { const socialContainer = Object.assign(document.createElement('div'), { className: "social__container" }); const icon = Object.assign(document.createElement("div"), { className: `share__icon share__${socialOption.split(" ").join("")}-icon` }); const socialText = Object.assign(document.createElement("span"), { className: "share__option-text" }, { textContent: `${socialOption}` }); const shareLink = (socialOption === "Copy Link") ? Object.assign(document.createElement('div'), { role: "button", className: "link-container CopyLink" }) : Object.assign(document.createElement('a'), { className: "link-container" }); if (socialOption === "LinkedIn") { shareLink.setAttribute('href', `https://www.linkedin.com/sharing/share-offsite/?url=${window.location.href}`); shareLink.setAttribute('target', '_blank'); } if (socialOption === "WhatsApp") { shareLink.setAttribute('href', `https://api.whatsapp.com/send?text=${window.location.href}`); shareLink.setAttribute('target', "_blank"); } if (socialOption === "Twitter") { shareLink.setAttribute('href', `https://twitter.com/intent/tweet?url=${window.location.href}`); shareLink.setAttribute('target', "_blank"); } shareLink.append(icon, socialText); socialContainer.append(shareLink); document.querySelector(".share__modal").appendChild(socialContainer); //adding copy url functionality if(socialOption === "Copy Link") { shareLink.addEventListener("click", function() { var tempInput = document.createElement("input"); tempInput.value = window.location.href; document.body.appendChild(tempInput); tempInput.select(); tempInput.setSelectionRange(0, 99999); // For mobile devices document.execCommand('copy'); document.body.removeChild(tempInput); this.querySelector(".share__option-text").textContent = "Copied" }) } }); // document.querySelector(".hover__share-modal-container").addEventListener("mouseover", () => document.querySelector('[data-gfg-action="share-article"]').classList.add("hover_share_menu")); } function toggleLikeElementVisibility(selector, show) { document.querySelector(`.${selector}`).style.display = show ? "block" : "none"; } function closeKebabMenu(){ document.getElementById("myDropdown").classList.toggle("show"); }
geeksforgeeks-footer-logo
Corporate & Communications Address:
A-143, 7th Floor, Sovereign Corporate Tower, Sector- 136, Noida, Uttar Pradesh (201305)
Registered Address:
K 061, Tower K, Gulshan Vivante Apartment, Sector 137, Noida, Gautam Buddh Nagar, Uttar Pradesh, 201305
GFG App on Play Store GFG App on App Store
Advertise with us
  • Company
  • About Us
  • Legal
  • Privacy Policy
  • In Media
  • Contact Us
  • Advertise with us
  • GFG Corporate Solution
  • Placement Training Program
  • Languages
  • Python
  • Java
  • C++
  • PHP
  • GoLang
  • SQL
  • R Language
  • Android Tutorial
  • Tutorials Archive
  • DSA
  • Data Structures
  • Algorithms
  • DSA for Beginners
  • Basic DSA Problems
  • DSA Roadmap
  • Top 100 DSA Interview Problems
  • DSA Roadmap by Sandeep Jain
  • All Cheat Sheets
  • Data Science & ML
  • Data Science With Python
  • Data Science For Beginner
  • Machine Learning
  • ML Maths
  • Data Visualisation
  • Pandas
  • NumPy
  • NLP
  • Deep Learning
  • Web Technologies
  • HTML
  • CSS
  • JavaScript
  • TypeScript
  • ReactJS
  • NextJS
  • Bootstrap
  • Web Design
  • Python Tutorial
  • Python Programming Examples
  • Python Projects
  • Python Tkinter
  • Python Web Scraping
  • OpenCV Tutorial
  • Python Interview Question
  • Django
  • Computer Science
  • Operating Systems
  • Computer Network
  • Database Management System
  • Software Engineering
  • Digital Logic Design
  • Engineering Maths
  • Software Development
  • Software Testing
  • DevOps
  • Git
  • Linux
  • AWS
  • Docker
  • Kubernetes
  • Azure
  • GCP
  • DevOps Roadmap
  • System Design
  • High Level Design
  • Low Level Design
  • UML Diagrams
  • Interview Guide
  • Design Patterns
  • OOAD
  • System Design Bootcamp
  • Interview Questions
  • Inteview Preparation
  • Competitive Programming
  • Top DS or Algo for CP
  • Company-Wise Recruitment Process
  • Company-Wise Preparation
  • Aptitude Preparation
  • Puzzles
  • School Subjects
  • Mathematics
  • Physics
  • Chemistry
  • Biology
  • Social Science
  • English Grammar
  • Commerce
  • World GK
  • GeeksforGeeks Videos
  • DSA
  • Python
  • Java
  • C++
  • Web Development
  • Data Science
  • CS Subjects
@GeeksforGeeks, Sanchhaya Education Private Limited, All rights reserved
We use cookies to ensure you have the best browsing experience on our website. By using our site, you acknowledge that you have read and understood our Cookie Policy & Privacy Policy
Lightbox
Improvement
Suggest Changes
Help us improve. Share your suggestions to enhance the article. Contribute your expertise and make a difference in the GeeksforGeeks portal.
geeksforgeeks-suggest-icon
Create Improvement
Enhance the article with your expertise. Contribute to the GeeksforGeeks community and help create better learning resources for all.
geeksforgeeks-improvement-icon
Suggest Changes
min 4 words, max Words Limit:1000

Thank You!

Your suggestions are valuable to us.

What kind of Experience do you want to share?

Interview Experiences
Admission Experiences
Career Journeys
Work Experiences
Campus Experiences
Competitive Exam Experiences