Understanding Operators and Expressions

In JavaScript, operators are symbols that perform operations on one or more operands (values or variables). An expression is a combination of operands, operators, and parentheses that evaluates to a single value. Understanding operators and expressions is crucial for writing any meaningful JavaScript code.

For example, 2 + 3 is an expression. 2 and 3 are operands, and + is the operator. This expression evaluates to the value 5.

Arithmetic Operators

Arithmetic operators are used to perform mathematical calculations. They include:

• + (Addition)
• - (Subtraction)
• * (Multiplication)
• / (Division)
• % (Modulus - returns the remainder of a division)
• ** (Exponentiation - ES2016 or ES7 feature)
• ++ (Increment - increases a variable's value by 1)
• -- (Decrement - decreases a variable's value by 1)

 let x = 10;
let y = 5;

console.log(x + y);  // Output: 15
console.log(x - y);  // Output: 5
console.log(x * y);  // Output: 50
console.log(x / y);  // Output: 2
console.log(x % y);  // Output: 0
console.log(x ** y); // Output: 100000 (10 to the power of 5)

x++;
console.log(x);      // Output: 11

y--;
console.log(y);      // Output: 4 

Comparison Operators

Comparison operators compare two values and return a boolean value (true or false). They include:

• == (Equal to - checks for value equality, but *not* type equality. Considered less safe than ===)
• === (Strict equal to - checks for both value and type equality)
• != (Not equal to - checks for value inequality, but *not* type inequality. Considered less safe than !==)
• !== (Strict not equal to - checks for both value and type inequality)
• > (Greater than)
• < (Less than)
• >= (Greater than or equal to)
• <= (Less than or equal to)

 console.log(5 == "5");   // Output: true (because of type coercion)
console.log(5 === "5");  // Output: false (different types)
console.log(5 != "5");   // Output: false (because of type coercion)
console.log(5 !== "5");  // Output: true (different types)
console.log(10 > 5);   // Output: true
console.log(10 < 5);   // Output: false
console.log(10 >= 10);  // Output: true
console.log(10 <= 5);   // Output: false 

Logical Operators

Logical operators are used to combine or modify boolean expressions. They include:

• && (Logical AND - returns true if both operands are true)
• || (Logical OR - returns true if at least one operand is true)
• ! (Logical NOT - returns the opposite boolean value of the operand)

 let a = true;
let b = false;

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

let x = 10;
let y = 5;

// Example using comparison and logical operators
console.log((x > 5) && (y < 10));  // Output: true (both conditions are true)
console.log((x < 5) || (y > 10));  // Output: false (both conditions are false) 

Assignment Operators

Assignment operators are used to assign values to variables. The basic assignment operator is =. There are also compound assignment operators that combine an assignment with another operation. They include:

• = (Assignment)
• += (Add and assign)
• -= (Subtract and assign)
• *= (Multiply and assign)
• /= (Divide and assign)
• %= (Modulus and assign)
• **= (Exponentiation and assign)

 let x = 10;

x = 20;       // Assignment: x is now 20
console.log(x); // Output: 20

x += 5;      // Add and assign: x is now 25 (20 + 5)
console.log(x); // Output: 25

x -= 3;      // Subtract and assign: x is now 22 (25 - 3)
console.log(x); // Output: 22

x *= 2;      // Multiply and assign: x is now 44 (22 * 2)
console.log(x); // Output: 44

x /= 4;      // Divide and assign: x is now 11 (44 / 4)
console.log(x); // Output: 11

x %= 3;      // Modulus and assign: x is now 2 (11 % 3)
console.log(x); // Output: 2

x **= 3;      // Exponentiation and assign: x is now 8 (2 ** 3)
console.log(x); // Output: 8 

Operator Precedence

Operator precedence determines the order in which operators are evaluated in an expression. Operators with higher precedence are evaluated before operators with lower precedence. You can use parentheses to override the default precedence.

Here's a summarized list of precedence from highest to lowest (not exhaustive):

• Parentheses ( )
• Exponentiation **
• Multiplication *, Division /, Modulus %
• Addition +, Subtraction -
• Comparison operators <, >, <=, >=
• Equality operators ==, !=, ===, !==
• Logical AND &&
• Logical OR ||
• Assignment operators =, +=, -=, etc.

 let result = 2 + 3 * 4; // Multiplication is performed before addition
console.log(result);      // Output: 14 (3 * 4 = 12, then 2 + 12 = 14)

let result2 = (2 + 3) * 4; // Parentheses force addition to be performed first
console.log(result2);     // Output: 20 (2 + 3 = 5, then 5 * 4 = 20)