JavaScript is one of the most popular programming languages in the world. It's the backbone of web development, used in millions of applications and frameworks. But let’s be honest—JavaScript is weird. It has quirks that baffle beginners and even make seasoned developers scratch their heads.
From type coercion oddities to bizarre comparisons, let's take a humorous dive into the weirdest parts of JavaScript that make us love (and sometimes hate) it.
1. The Infamous typeof null
You’d expect null to be an object type, right? Well, JavaScript thinks otherwise:
console.log(typeof null); // "object" 🤔
Yes, null is not an object. This is actually a legacy bug from the early days of JavaScript, but fixing it would break too much existing code—so we’re stuck with it!
2. Double Equals (==) vs. Triple Equals (===)
JavaScript loves to coerce types when using ==
, which can lead to some hilarious results:
console.log(0 == "0"); // true
console.log(false == "0"); // true
console.log(false == []); // true
console.log(false == {}); // false
But with ===
, it checks both value and type, which prevents these odd comparisons:
console.log(0 === "0"); // false
console.log(false === "0"); // false
Lesson? Always use triple equals (===
) unless you have a really good reason not to!
3. Adding Arrays and Objects
Ever tried adding an array and an object together? Probably not, but JavaScript lets you do it anyway:
console.log([] + {}); // "[object Object]"
console.log({} + []); // 0
What’s happening here? When JavaScript encounters [] + {}
, it converts both into strings before concatenating them. However, when {}
appears first, JavaScript interprets it as an empty block of code and evaluates +[]
, which results in 0.
4. NaN is Not Equal to Itself
You’d expect a value to be equal to itself, but JavaScript disagrees:
console.log(NaN === NaN); // false
Why? Because NaN
(Not-a-Number) represents an invalid number, and JavaScript ensures that no invalid number is equal to any other—even itself. To check for NaN, use:
console.log(Number.isNaN(NaN)); // true
5. JavaScript Arrays Are Not Always Arrays
You might think an array's length corresponds to the number of elements, but that’s not always the case:
const arr = [1, 2, 3];
arr[100] = 4;
console.log(arr.length); // 101 🤯
In JavaScript, arrays are just objects with numerical keys. Assigning a value to arr[100]
doesn’t create elements in between—it just sets a sparse array with a length of 101.
6. Truthy and Falsy Madness
In JavaScript, some values that seem completely valid are actually falsy:
console.log(Boolean("")); // false
console.log(Boolean(0)); // false
console.log(Boolean([])); // true 😲
console.log(Boolean({})); // true
console.log(Boolean(undefined)); // false
Yes, an empty array ([]
) and an empty object ({}
) are truthy, but 0
, ""
, and undefined
are falsy.
7. Function Overloading? Nope!
In many programming languages, you can define multiple functions with the same name but different parameters. JavaScript doesn’t support this, but it won’t complain either:
function foo(a) {
console.log("First definition", a);
}
function foo(a, b) {
console.log("Second definition", a, b);
}
foo(1); // "Second definition", 1, undefined
The second definition overwrites the first one, and JavaScript won’t warn you. 🤦♂️
8. JavaScript’s Math is a Little Off
You’d expect JavaScript to handle simple math correctly, right?
console.log(0.1 + 0.2); // 0.30000000000000004
Blame floating-point precision—JavaScript (like most languages) uses binary floating-point arithmetic, which can lead to small rounding errors. If you need precise calculations, use:
console.log((0.1 + 0.2).toFixed(2)); // "0.30"
Conclusion: Embrace the Chaos
JavaScript is a wild and quirky language, but its flexibility and weirdness are part of its charm. Once you understand its quirks, you can use them to your advantage—or at least know what to avoid! 😆
What’s the weirdest JavaScript quirk you’ve encountered? Let me know in the comments! 🚀