Operators and Expressions

Operators and Expressions in JavaScript

In JavaScript, operators and expressions are fundamental concepts that you’ll encounter frequently while coding. Understanding how they work will help you write more powerful and efficient code. Whether you're performing basic arithmetic, making comparisons, or manipulating data, operators and expressions are involved in almost every operation.

This blog post will walk you through what operators and expressions are, explain the different types of operators in JavaScript, and show how to use them effectively.


1. What Are Operators in JavaScript?

An operator is a symbol used to perform operations on values (or variables). JavaScript has a variety of operators that perform different tasks, such as arithmetic, comparison, logical operations, and more.

Types of Operators

  1. Arithmetic Operators
  2. Comparison Operators
  3. Logical Operators
  4. Assignment Operators
  5. Bitwise Operators
  6. Ternary Operator
  7. Other Operators (e.g., Spread, Rest, etc.)

2. Arithmetic Operators

Arithmetic operators are used to perform mathematical calculations.

OperatorDescriptionExample
+Addition5 + 3 = 8
-Subtraction5 - 3 = 2
*Multiplication5 * 3 = 15
/Division5 / 3 = 1.67
%Modulus (Remainder)5 % 3 = 2
++Increment (adds 1)x++ or ++x
--Decrement (subtracts 1)x-- or --x

Example:

let x = 5;
let y = 3;
 
console.log(x + y); // Output: 8
console.log(x * y); // Output: 15
console.log(x % y); // Output: 2

3. Comparison Operators

Comparison operators are used to compare two values and return a boolean value (true or false).

OperatorDescriptionExample
==Equal to5 == '5'
===Strictly equal to (checks type and value)5 === '5'
!=Not equal to5 != 3
!==Strictly not equal to5 !== '5'
>Greater than5 > 3
<Less than5 < 3
>=Greater than or equal to5 >= 3
<=Less than or equal to5 <= 3

Example:

console.log(5 == 5); // Output: true
console.log(5 === '5'); // Output: false
console.log(5 !== 3); // Output: true
console.log(5 > 3); // Output: true

4. Logical Operators

Logical operators are used to combine or invert boolean values. These operators are particularly useful in decision-making and conditional statements.

OperatorDescriptionExample
&&Logical AND (both must be true)true && false
``
!Logical NOT (inverts a boolean)!true

Example:

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

5. Assignment Operators

Assignment operators are used to assign values to variables. They can also combine an operation with assignment.

OperatorDescriptionExample
=Simple assignmentx = 5
+=Add and assignx += 3
-=Subtract and assignx -= 3
*=Multiply and assignx *= 3
/=Divide and assignx /= 3
%=Modulus and assignx %= 3

Example:

let x = 5;
x += 3; // Same as x = x + 3
console.log(x); // Output: 8
 
x *= 2; // Same as x = x * 2
console.log(x); // Output: 16

6. Bitwise Operators

Bitwise operators are used to perform operations on numbers at the binary level. These operators are useful for low-level programming, though they are not commonly used in everyday applications.

OperatorDescriptionExample
&AND5 & 3
``OR
^XOR (exclusive OR)5 ^ 3
~NOT (inverts bits)~5
<<Left shift5 << 1
>>Right shift5 >> 1
>>>Unsigned right shift5 >>> 1

Example:

console.log(5 & 3);  // Output: 1
console.log(5 | 3);  // Output: 7
console.log(5 ^ 3);  // Output: 6

7. Ternary Operator

The ternary operator is a shorthand for an if-else statement. It takes three operands and is used to assign a value based on a condition.

Syntax:

condition ? expression1 : expression2
  • If the condition is true, expression1 is executed.
  • If the condition is false, expression2 is executed.

Example:

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

8. Other Operators

In addition to the standard operators mentioned above, JavaScript also includes operators like the spread operator, rest operator, and the typeof operator.

Spread Operator (...)

The spread operator is used to unpack elements from an array or object.

const arr = [1, 2, 3];
const newArr = [...arr, 4, 5];
console.log(newArr); // Output: [1, 2, 3, 4, 5]

Rest Operator (...)

The rest operator is used to collect a variable number of arguments into an array.

function sum(...numbers) {
  return numbers.reduce((acc, num) => acc + num, 0);
}
console.log(sum(1, 2, 3, 4)); // Output: 10

typeof Operator

The typeof operator is used to determine the type of a variable or value.

let x = 42;
console.log(typeof x); // Output: number

9. Expressions in JavaScript

An expression is any valid combination of values, variables, operators, and functions that can be evaluated to produce a value. Expressions can be as simple as a single value or as complex as an entire calculation.

Examples of Expressions:

  • Arithmetic Expression: 5 + 3
  • Logical Expression: true && false
  • String Expression: 'Hello ' + 'World'

An expression always results in a value, whether it’s a number, string, boolean, or another data type.

Example:

let x = 5 + 3; // Expression that results in 8
let y = x * 2; // Expression that results in 16

Conclusion

Operators and expressions are the building blocks of JavaScript, allowing you to manipulate data and control the flow of your programs. By understanding the different types of operators and how to use them effectively, you can create more efficient and readable code.


Practice Code Snippet

JavaScript Code Runner on: operators

IndGeek provides solutions in the software field, and is a hub for ultimate Tech Knowledge.