Skip to content

README.md

Latest commit

 

History

History
340 lines (232 loc) · 10.1 KB

README.md

File metadata and controls

340 lines (232 loc) · 10.1 KB

📘 03. JavaScript Operators

JavaScript operators are symbols or keywords used to perform operations on values and variables. Operators are essential to almost every JavaScript expression.

🧠 Table of Contents

  1. Arithmetic Operators
  2. Assignment Operators
  3. Comparison Operators
  4. Logical Operators
  5. Bitwise Operators
  6. Unary Operators
  7. Ternary Operator
  8. String Operators
  9. Type Operators
  10. Comma Operator
  11. Optional Chaining & Nullish Coalescing
  12. Interview Questions
  13. Mermaid Diagram
  14. References

1️⃣ Arithmetic Operators

Used for numeric calculations.

Operator Description Example Result
+ Addition 5 + 3 8
- Subtraction 10 - 4 6
* Multiplication 2 * 4 8
/ Division 8 / 2 4
% Modulus (remainder) 7 % 3 1
** Exponentiation 2 ** 3 8
++ Increment let i = 1; i++ 2
-- Decrement let i = 1; i-- 0

2️⃣ Assignment Operators

Used to assign values to variables.

Operator Example Meaning
= x = 10 Assign 10 to x
+= x += 5 x = x + 5
-= x -= 3 x = x - 3
*= x *= 2 x = x * 2
/= x /= 4 x = x / 4
%= x %= 2 x = x % 2
**= x **= 3 x = x ** 3

3️⃣ Comparison Operators

Used to compare values.

Operator Description Example Result
== Equal to (loose) 5 == '5' true
=== Equal to (strict) 5 === '5' false
!= Not equal to 5 != '5' false
!== Strict not equal 5 !== '5' true
> Greater than 8 > 5 true
< Less than 3 < 4 true
>= Greater than or equal 5 >= 5 true
<= Less than or equal 7 <= 6 false

4️⃣ Logical Operators

Used for boolean logic.

Operator Description Example Result
&& AND true && false false
` ` OR `true false` true
! NOT !true false

5️⃣ Bitwise Operators

Operate on binary representations.

Operator Description Example
& AND 5 & 1 => 1
` ` OR `5 1=>5`
^ XOR 5 ^ 1 => 4
~ NOT ~5 => -6
<< Left shift 5 << 1 => 10
>> Right shift 5 >> 1 => 2

6️⃣ Unary Operators

Operate on a single operand.

Operator Description Example
typeof Returns type typeof 42 → "number"
delete Deletes object prop delete obj.name
void Returns undefined void(0) → undefined
! Logical NOT !false → true

7️⃣ Ternary Operator

A shorthand for if-else.

let age = 18;
let access = (age >= 18) ? "Allowed" : "Denied";
console.log(access); // Allowed

8️⃣ String Operators

Used to concatenate strings.

let first = "Code";
let second = "Harbor";
console.log(first + second); // "CodeHarbor"

9️⃣ Type Operators

Check the data type or construct.

Operator Use Case
typeof typeof "hello" → "string"
instanceof arr instanceof Array → true

🔟 Comma Operator

Evaluates multiple expressions and returns the last.

let x = (1 + 2, 3 + 4); 
console.log(x); // 7

🔁 11. Optional Chaining & Nullish Coalescing

  • Optional Chaining (?.): Safe access to nested properties.
let user = {};
console.log(user.profile?.name); // undefined (no error)
  • Nullish Coalescing (??): Returns right operand if left is null or undefined.
let value = null ?? "Default";
console.log(value); // "Default"

💬 12. Interview Questions

1. What is the difference between == and ===?

In JavaScript:

  • == (Loose Equality): Compares two values for equality after converting both values to a common type (type coercion). For example, 5 == '5' returns true because the string '5' is converted to the number 5 before comparison.

  • === (Strict Equality): Compares both the value and the type without performing any type conversion. For example, 5 === '5' returns false because the types (number and string) are different.

Best Practice: Use === to avoid unexpected type conversions and ensure both value and type match.

2. What is a ternary operator in JavaScript?

The ternary operator is a concise way to perform conditional operations. It takes three operands:

condition ? expressionIfTrue : expressionIfFalse;

Example:

let age = 20;
let beverage = age >= 18 ? "Beer" : "Juice";
console.log(beverage); // Outputs: "Beer"

It's a shorthand for simple if-else statements.

3. What is short-circuit evaluation?

Short-circuit evaluation refers to the process where JavaScript evaluates logical expressions from left to right and stops as soon as the outcome is determined.

  • Logical AND (&&): If the first operand is falsy, the entire expression returns that falsy value without evaluating the second operand.

  • Logical OR (||): If the first operand is truthy, the entire expression returns that truthy value without evaluating the second operand.

Example:

let result = null || "Default";
console.log(result); // Outputs: "Default"

Here, null is falsy, so the || operator returns the second operand.

4. How does optional chaining prevent errors?

Optional chaining (?.) allows you to safely access deeply nested object properties without having to check each level manually.

Example:

let user = {};
console.log(user.profile?.name); // Outputs: undefined

Without optional chaining, accessing user.profile.name would throw an error if profile is undefined. Optional chaining prevents such errors by short-circuiting the evaluation if any part of the chain is null or undefined.

5. What is the difference between && and ||?

  • && (Logical AND): Returns the first falsy operand or the last operand if all are truthy. It's used when all conditions need to be true.

  • || (Logical OR): Returns the first truthy operand or the last operand if all are falsy. It's used when at least one condition needs to be true.

Example:

console.log(true && false); // Outputs: false
console.log(false || true); // Outputs: true

These operators are also used for control flow and setting default values.

6. Explain bitwise AND with an example.

The bitwise AND (&) operator performs a binary AND operation on two numbers.

Example:

let a = 5;  // Binary: 0101
let b = 3;  // Binary: 0011
let result = a & b; // Binary: 0001
console.log(result); // Outputs: 1

Each bit of the result is 1 only if the corresponding bits of both operands are 1.

7. What is the use of the delete operator?

The delete operator is used to remove a property from an object.

Example:

let obj = { name: "Alice", age: 25 };
delete obj.age;
console.log(obj); // Outputs: { name: "Alice" }

Notes:

  • It removes the property from the object, and the property becomes undefined.
  • It does not affect variables or functions declared with var, let, or const.
  • When used on arrays, it removes the element but does not update the length, leading to sparse arrays.

🧭 13. Mermaid Diagram

graph TD
  A[Operators] --> B[Arithmetic]
  A --> C[Assignment]
  A --> D[Comparison]
  A --> E[Logical]
  A --> F[Bitwise]
  A --> G[Unary]
  A --> H[Ternary]
  A --> I[String]
  A --> J[Type]
  A --> K[Comma]
  A --> L[Optional Chaining / Nullish Coalescing]
Loading

🔗 14. References

🙌 Follow & Support

This content is crafted by Ajay Dhangar. If you find it helpful, don't forget to ⭐ star this repo and follow on CodeHarborHub for more such content!