Operators in JavaScript

Understand different types of JavaScript operators with examples and use cases.

Loading...
Operators in JavaScript

What are Operators?

Operators are symbols that are used to perform operations on operands which can be variables or values. They play an important role in achieving various tasks within your code.

Types of Operators

JavaScript provides the following types of operators.

  1. Arithmetic Operators
  2. Assignment Operators
  3. Comparison Operators
  4. Logical Operators

Let's understand each one with examples.

Arithmetic Operators

If you want to perform mathematical calculations on numeric values, then you can use the arithmetic operators.

JavaScript provides the following arithmetic operators:

  • Addition (+)

    The addition operator is used to add two numbers together.

    For example:

    let num1 = 10;
    let num2 = 5;
    let sum = num1 + num2;
    console.log(sum); // Output: 15
  • Subtraction (-)

    The subtraction operator is used to subtract two numbers.

    For example:

    let num1 = 10;
    let num2 = 5;
    let difference = num1 - num2;
    console.log(difference); // Output: 5
  • Multiplication (*)

    The multiplication operator is used to multiply two numbers.

    For example:

    let num1 = 10;
    let num2 = 5;
    let product = num1 * num2;
    console.log(product); // Output: 50
  • Division (/)

    The division operator is used to divide the first number by the second number.

    For example:

    let num1 = 10;
    let num2 = 5;
    let quotient = num1 / num2;
    console.log(quotient); // Output: 2
  • Modulus (%)

    The modulus operator returns the remainder of a division operation.

    For example:

    let num1 = 16;
    let num2 = 5;
    let remainder = num1 % num2;
    console.log(remainder); // Output: 1
  • Increment (++)

    The increment operator is used to increase the value of a variable by one.

    For example:

    let num = 13;
    num++;
    console.log(num); // Output:14
  • Decrement (--)

    The decrement operator is used to decrease the value of a variable by one.

    For example:

    let num = 13;
    num--;
    console.log(num); // Output:12

Assignment Operators

If you want to assign values to variables, then you can use the assignment operators. They can also perform operations while assigning values.

JavaScript provides the following assignment operators:

  • = operator

    The assignment operator assigns a value to a variable.

    For example:

    let x = 10; // x is assigned the value 10
  • += operator

    Adds the right operand to the left operand and assigns the result to the left operand.

    let x = 10;
    x += 5;
    console.log(x); // x is now 15 (x = x + 5)
  • -= operator

    Subtracts the right operand from the left operand and assigns the result to the left operand.

    let x = 10;
    x -= 6;
    console.log(x); // x is now 4 (x = x - 6)
  • *= operator

    Multiplies the left operand by the right operand and assigns the result to the left operand.

    let x = 10;
    x *= 4;
    console.log(x); // x is now 40 (x = x * 4)
  • /= operator

    Divides the left operand by the right operand and assigns the result to the left operand.

    let x = 10;
    x /= 2;
    console.log(x); // x is now 5 (x = x / 2)
  • %= operator

    Calculates the remainder when the left operand is divided by the right operand and assigns it to the left operand.

    let x = 10;
    x %= 3;
    console.log(x); // x is now 1 (x = x % 3)

Comparison Operators

If you want to compare two variables, then you can use the comparison operators. These operators return a Boolean result (true or false) indicating whether the comparison is true or false.

JavaScript provides the following comparison operators:

  • Equality (==)

    The equality operator is used to compare the values of variables.

    For example:

    let x = 5; // this is an number
    let y = "5"; // this is a string
    console.log(x == y); // Output: true

    In the above example, the output is true because the value of both variables is the same i.e. 5.

  • Inequality (!=)

    The inequality operator is used to check if the values of two variables are not equal.

    For example:

    let x = 5;
    let y = "6";
    console.log(x != y); // Output: true

    In the above example, the output is true because the value of x is not equal to the value of y.

  • Strict Equality (===)

    The strict equality operator is used to compare both values and data types of variables.

    For example:

    let x = 5; // this is an number
    let y = "5"; // this is a string
    console.log(x === y); // Output: false

    In the above example, the output is false because the values of both variables are the same but their data types are not the same.

  • Strict Inequality (!==)

    The strict inequality operator is used to check if the values and data types of two variables are not equal.

    For example:

    let x = 5; //this is an number
    let y = "5"; //this is a string
    console.log(x !== y); // Output: true

    In the above example, the output is true because the data types of both variables are not the same.

  • Ternary Operator (Conditional Operator)

    The ternary operator, also known as the conditional operator, allows you to write concise conditional statements.

    The ternary operator has the following syntax:

    condition ? expression(if condition true) : expression(if condition false)

    Here, the condition is evaluated first. If the condition is true, then the expression before the : (colon) is executed, and its result becomes the result of the entire expression.

    If the condition is false, then the expression after the : (colon) is executed, and its result becomes the result of the entire expression.

    Example: 1

    let age = 18;
    let canDrive = age >= 18 ? "You can drive." : "You cannot drive.";
    console.log(canDrive); // Output: You can drive

    Example: 2

    let isMorning = false;
    let greeting = isMorning ? "Good Morning!" : "Good Evening!";
    console.log(greeting); // Output: Good Evening!

    Nested Ternary Operators

    A nested ternary operator is a conditional operator that is nested inside another conditional operator.

    For example:

    const score = 75;
    const grade = score >= 90 ? "A" : score >= 70 ? "B" : score >= 50 ? "C" : "D";
     
    console.log(`Your grade is ${grade}`); // Output: Your grade is B

    Here, you have a score variable with a value of 75.

    In the ternary operator, the first condition checks if the score is greater than or equal to 90, if it’s true then it sets the value of the variable grade to “A” and if it’s false then it checks on the second condition which is score >= 70.

    If the condition score >=70 is true then it sets the value of the variable grade to “B” and if it’s false then it checks on the next condition which is score >= 50.

    If the condition score>=50 is true then it sets the value of the variable grade to “C” and if it’s false then it sets the value of the variable grade to “D”.

    In this case, you have score = 75, which means score>=70, so the value of the variable grade is set to “B”.

  • Other Comparison Operators (<, >, <=, >=)

    JavaScript also provides operators such as greater than (>), less than (<), greater than or equal to (>=), and less than or equal to (<=).

    Example: 1

    let x = 5;
    let y = 16;
    console.log(x > y); // Output: false

    Example: 2

    let x = 5;
    let y = 16;
    console.log(x < y); // Output: true

    Example: 3

    let x = 5;
    let y = 16;
    console.log(x >= y); // Output: false

    Example: 4

    let x = 5;
    let y = 16;
    console.log(x <= y); // Output: true

Logical Operators

Logical operators are used on one or more variables and return true or false.

JavaScript provides the following logical operators:

  • Logical AND (&&)

    The logical AND operator returns true if both of its operands are true. Otherwise, it returns false. It can be used to check multiple conditions.

    Example: 1

    let x = 13;
    console.log(x < 15 && x > 12); // Output: true

    In the above example, the output is true because condition x<15 is true and condition x>12 is true i.e., both conditions are true.

    Example: 2

    let x = 13;
    console.log(x < 15 && x > 14); // Output: false

    In the above example, the output is false because condition x<15 is true, but condition x>14 is false i.e., both conditions are not true.

    You can also check more than two conditions using the && operator.

    For example:

    let a = true;
    let b = true;
    let c = false;
    console.log(a && b && c); // Output: false

    Here the output is false because one variable (c) is false.

  • Logical OR (||)

    The logical OR operator returns true if at least one of its operands is true. It returns false if both operands are false.

    Example:1

    let x = 13;
    console.log(x > 15 || x < 20); // Output: true

    Here the output is true because one of the conditions (x<20) is true.

    Example: 2

    let x = 13;
    console.log(x > 15 || x < 12); // Output: false

    Here the output is false because both of the conditions are false.

    Example: 3

    let a = true;
    let b = false;
    console.log(a || b); // Output: true

    Here the output is true because one of the conditions is true.

  • Logical NOT (!)

    The logical NOT operator reverses a Boolean value. That means if the operand is true, it becomes false, and if the operand is false, it becomes true.

    For example:

    let a = true;
    console.log(!a); // Output: false
     
    let b = false;
    console.log(!b); // Output: true

Support my work!