Operators in JavaScript
---
1. Arithmetic Operators
Used for mathematical operations on numbers:
`+` (Addition)
`-` (Subtraction)
`*` (Multiplication)
`/` (Division)
`%` (Remainder/Modulus)
`**` (Exponentiation)
`++` (Increment)
`--` (Decrement)
Eg:
let x = 10 % 3; // Returns 1 (remainder)
---
2. Assignment Operators
Assign values to variables:
`=` (Simple assignment)
`+=` (Add and assign)
`-=` (Subtract and assign)
`*=` (Multiply and assign)
`/=` (Divide and assign)
`%=` (Modulus and assign)
`**=` (Exponentiation and assign)
Eg:
let y = 5;
y **= 2; // y = 25
---
### **3. Comparison Operators or Relational operators
Compare values and return a boolean (`true`/`false`):
`==` (Loose equality)
`===` (Strict equality)
`!=` (Loose inequality)
`!==` (Strict inequality)
`>` (Greater than)
`<` (Less than)
`>=` (Greater than or equal)
`<=` (Less than or equal)
Eg:
"5" == 5; // true (type coercion)
"5" === 5; // false (strict check)
---
4. Logical Operators
Used with boolean values:
`&&` (Logical AND)
`||` (Logical OR)
`!` (Logical NOT)
`??` (Nullish Coalescing)
Eg:
true && false; // false
---
5. Bitwise Operators
Perform operations on 32-bit binary representations:
`&` (AND)
`|` (OR)
`^` (XOR)
`~` (NOT)
`<<` (Left shift)
`>>` (Right shift)
`>>>` (Zero-fill right shift)
Eg:
5 & 1; // 1 (0101 & 0001 = 0001)
---
6. String Operators
`+` (Concatenation)
`+=` (Concatenate and assign)
Eg:
"Hello" + " World"; // "Hello World"
---
### **7. Ternary (Conditional) Operator**
- `condition ? expr1 : expr2`
Eg:
let age = 20;
let status = (age >= 18) ? "Adult" : "Minor"; // "Adult"
---
8. Unary Operators
Operate on a single operand:
`typeof` (Returns variable type)
`void` (Discards expression return value)
`delete` (Removes object properties)
`+` (Converts to number)
`-` (Negates a number)
Eg:
typeof 42; // "number"
---
9. Relational Operators
- `in` (Checks if property exists in an object)
- `instanceof` (Checks object type)
Eg:
"length" in []; // true
---
10. Other Operators
- `...` (Spread/Rest)
- `,` (Comma operator)
- `new` (Creates object instance)
- `super` (Calls parent class methods)
Eg:
const arr = [...[1, 2], 3]; // [1, 2, 3]
-----------------------------------------------------------------------------------
--
Nullish Coalescing Operator (`??`) in JavaScript
-----------------------------------------------------------------------
The `??` operator (Nullish Coalescing) is a logical operator that returns its
right-hand operand when the left-hand operand is `null` or `undefined`. Otherwise,
it returns the left-hand operand.
#### **Key Points**
1. Purpose:
Provide a default value for `null` or `undefined` (but not for other falsy values
like `0`, `""`, or `false`).
2. Introduced in: ES2020 (ECMAScript 2020).
3.Alternative to: The logical OR (`||`) operator, but with stricter checks.
Syntax:
leftOperand ?? rightOperand
- If `leftOperand` is `null` or `undefined`, return `rightOperand`.
- Otherwise, return `leftOperand`.
---
Examples
1. Basic Usage
let username = null;
let defaultName = "Guest";
console.log(username ?? defaultName); // "Guest" (since username is null)
2. Difference Between `??` and `||`
The `||` operator returns the right-hand operand for any falsy value (`0`, `""`,
`false`, `null`, `undefined`, `NaN`), while `??` only cares about `null` or
`undefined`.
let count = 0;
let defaultValue = 10;
console.log(count || defaultValue); // 10 (0 is falsy)
console.log(count ?? defaultValue); // 0 (0 is not null/undefined)
3. Chaining with `??`
let userInput = undefined;
let fallback1 = null;
let fallback2 = "Final Value";
console.log(userInput ?? fallback1 ?? fallback2); // "Final Value"
Steps:
userInput (undefined) → fallback1 (null) → fallback2 ("Final Value")
4. Combining with Optional Chaining (`?.`)
const user = { name: "Alice", age: 25 };
console.log(user.address?.city ?? "City not set"); // "City not set"
// If `user.address` or `user.address.city` is null/undefined, use fallback.
---
Browser Support
- Supported in all modern browsers (Chrome, Firefox, Edge, Safari) and Node.js 14+.
- Not supported in Internet Explorer.
---
Summary:
`??` is ideal for providing fallbacks only when a value is `null` or `undefined`.
`||` is broader and replaces all falsy values, which may not always be desired.
