Home 〉 Javascript Tutorials 〉 JavaScript Operators Explained with Examples | Complete Guide

JavaScript Operators Explained with Examples | Complete Guide !

JavaScript Operators Explained with Examples | Complete Guide !

Summary

What are JavaScript operators, and how do they function in your code? This guide delves into the various types of JavaScript operators—arithmetic, comparison, logical, bitwise, string, and ternary—providing syntax, examples, and detailed explanations for each. You'll learn how to use these operators individually and in combination to perform complex operations. By the end, you'll have a solid understanding of how operators work in JavaScript, enhancing your coding proficiency. Let's explore the world of JavaScript operators!

Introduction to JavaScript Operators

In JavaScript, operators are symbols that perform operations on variables and values. They are essential for tasks like arithmetic calculations, comparisons, logical operations, and more. Understanding these operators is crucial for writing effective JavaScript code.

Arithmetic Operators

Arithmetic operators perform basic mathematical operations:

  • + : Addition
  • - : Subtraction
  • * : Multiplication
  • / : Division
  • % : Modulus (Remainder)
  • ** : Exponentiation
  • ++ : Increment
  • -- : Decrement

Example:

Example 📄

let a = 10;
let b = 3;
console.log(a + b); // 13
console.log(a - b); // 7
console.log(a * b); // 30
console.log(a / b); // 3.333...
console.log(a % b); // 1
console.log(a ** b); // 1000
a++;
console.log(a); // 11
b--;
console.log(b); // 2

These operators are fundamental for performing calculations in JavaScript.

Comparison Operators

Comparison operators compare two values and return a boolean result:

  • == : Equal to
  • === : Equal value and type
  • != : Not equal
  • !== : Not equal value or type
  • > : Greater than
  • < : Less than
  • >= : Greater than or equal to
  • <= : Less than or equal to

Example:

Example 📄

let x = 5;
let y = '5';
console.log(x == y); // true
console.log(x === y); // false
console.log(x != y); // false
console.log(x !== y); // true
console.log(x > 3); // true
console.log(x < 3); // false

Use these operators to compare values and make decisions in your code.

Logical Operators

Logical operators are used to determine the logic between variables or values:

  • && : Logical AND
  • || : Logical OR
  • ! : Logical NOT

Example:

Example 📄

let a = true;
let b = false;
console.log(a && b); // false
console.log(a || b); // true
console.log(!a); // false

Logical operators are essential for controlling the flow of your programs.

Bitwise Operators

Bitwise operators perform operations on binary representations of numbers:

  • & : AND
  • | : OR
  • ^ : XOR
  • ~ : NOT
  • << : Left shift
  • >> : Right shift
  • >>>> : Zero-fill right shift

Example:

Example 📄

let a = 5; // 0101
let b = 3; // 0011
console.log(a & b); // 1 (0001)
console.log(a | b); // 7 (0111)
console.log(a ^ b); // 6 (0110)
console.log(~a); // -6
console.log(a << 1); // 10
console.log(a >> 1); // 2

Bitwise operators are useful for low-level programming tasks.

String Operator

The + operator is also used for string concatenation:

Example:

Example 📄

let firstName = 'John';
let lastName = 'Doe';
console.log(firstName + ' ' + lastName); // John Doe

Use the + operator to combine strings.

Conditional (Ternary) Operator

The ternary operator is a shorthand for the if-else statement:

Syntax:

html syntax ✍

condition ? expressionIfTrue : expressionIfFalse;

Example:

Example 📄

let age = 18;
let status = (age >= 18) ? 'Adult' : 'Minor';
console.log(status); // Adult

The ternary operator is concise and useful for simple conditional assignments.

Combining Multiple Operators

You can combine multiple operators to perform complex operations:

Example:

Example 📄

let a = 5;
let b = 10;
let c = 15;
let result = (a + b > c) && (b < c);
console.log(result); // true

In this example, (a + b > c) evaluates to true, and (b < c) is also true. The logical AND (&&) returns true because both conditions are true.

Conclusion

Understanding JavaScript operators is fundamental for writing efficient and effective code. From performing arithmetic calculations to making logical decisions, operators are integral to programming in JavaScript. Practice using these operators to become proficient in their application.

Frequently Asked Questions (FAQs)

What is the difference between == and === in JavaScript?

The == operator compares values for equality after converting both values to a common type, whereas === compares both value and type without conversion.

Can I use multiple operators in a single expression?

Yes, you can combine multiple operators in a single expression. Be mindful of operator precedence to ensure the expression evaluates as intended.

What does the modulus (%) operator do?

The modulus operator returns the remainder of a division operation. For example, 10 % 3 returns 1.

Previous Post Next Post