In many programming languages, adding a number to a string results in an error. In JavaScript, it results in a feature (or a bug, depending on who you ask).
1. The Chameleon Operator: Addition (+)
The + operator is unique in JavaScript because it serves two distinct purposes:
Mathematical Addition (for numbers).
String Concatenation (for strings).
The Rule: If any operand is a string, JavaScript converts the other operand to a string and concatenates them. String conversion takes priority.
| Operation | Result | Explanation |
| 10 + 5 | 15 | Both are numbers. Math happens. |
| "10" + "5" | "105" | Both are strings. Concatenation happens. |
| 10 + "5" | "105" | Coercion: 10 becomes "10", then joins "5". |
| "Hello" + 5 | "Hello5" | Number converts to string. |
| 5 + 5 + "5" | "105" | Left-to-right: 5+5 = 10, then 10+"5" = "105". |
| "5" + 5 + 5 | "555" | Left-to-right: "5"+5 = "55", then "55"+5 = "555". |
2. The Pure Math Operators (-, *, /, %)
Unlike +, these operators exist only for mathematics.
The Rule: JavaScript tries to convert everything to a Number. If it can't, the result is NaN (Not a Number).
| Operation | Result | Explanation |
| "10" - 5 | 5 | Coercion: String "10" becomes Number 10. |
| "10" * "2" | 20 | Both strings are converted to numbers. |
| "10" / 2 | 5 | String becomes number. |
| "Hello" - 2 | NaN | "Hello" cannot become a number. |
Key Takeaway: This is why 10 + "10" is "1010", but 10 - "10" is 0.
3. Comparison Operators (<, >, <=, >=)
Comparisons can get tricky when types don't match.
A. Number vs. String (Numeric Context)
If you compare a number to a string, JS converts the string to a number.
B. String vs. String (Lexicographical Context)
If both sides are strings, JS compares them alphabetically (dictionary order, character by character code). This causes bugs.
Why? In a dictionary, "1" comes before "2". It doesn't matter that 10 is mathematically larger; JS only checks the first character.
4. Equality Operators (== vs ===)
This is the most critical distinction in JavaScript logic.
Abstract Equality (==)
Allows type conversion. JS tries to find a common type before comparing.
5 == "5" → true (String "5" becomes Number 5).
true == 1 → true (true becomes 1).
null == undefined → true (Special rule: they are "equal" to each other but nothing else).
Strict Equality (===)
No conversion allowed. Types must match.
5 === "5" → false (Different types).
null === undefined → false.
Best Practice: Always use ===.
5. The Odd Couple: null and undefined in Math
While they seem similar, null and undefined behave very differently when forced into mathematical operations.
Null (The "0" Placeholder)
null converts to 0 in numeric contexts.
Undefined (The "Not Existing")
undefined converts to NaN in numeric contexts.
6. Summary Cheat Sheet
| Operator | Scenario | Behavior | Result Example |
| + | String + Number | Concatenation (String wins) | "5" + 2 → "52" |
| - * / | String - Number | Math (Number wins) | "5" - 2 → 3 |
| > < | String vs String | Dictionary Order | "10" < "2" → true |
| == | Mixed Types | Converts to Number usually | 0 == false → true |
| === | Mixed Types | Returns false immediately | 0 === false → false |