CodersTechZone
  • .NET
    • C#
    • ASP.Net
  • HTML
  • Javascript
  • CSS
  • Database
    • SQL Server
    • MYSql
    • Oracle
  • AI
  • TechNews
  • Web-Stories

7 Weird JavaScript Tricks That Look Like Bugs (#3 Will Shock You!)

Shawpnendu Bikash Maloroy

April 8, 2025
7 Weird JavaScript Tricks That Look Like Bugs
Spread the love

JavaScript has some peculiar behaviors that look like bugs but are technically correct. These mysterious behavior make beginners confused. But if you dig down the aspects its always fascinating.

In this article I am going to explain such 7 weird JavaScript tricks that feel like bugs but are actually real. Wanna explore how JavaScript works under the hood?

Let’s explore these fabulous JavaScript tricks, understand why they occur. Wait! We will also explain when to use them in real code or not. So bear with us for 5 minutes BRO to see the amazing JS code examples!

Table of Contents

  • 1. true + false = 1 (Boolean Arithmetic)
    • Why This Happens
    • Practical Example
  • 2. [] + {} = “[object Object]” (Strange Concatenation)
    • What’s Happening?
  • 3. 0.1 + 0.2 !== 0.3 (Floating-Point Puzzle)
    • Why This Happens
    • Solutions
  • 4. “b” + “a” + +”a” + “a” = “baNaNa”
    • Breakdown
  • 5. (!+[]+[]+![]).length === 9
    • Step-by-Step Explanation
  • 6. null > 0, null == 0, null >= 0 (Weird Comparisons)
    • Why?
  • 7. “2” + “2” – “2” = 20 (String vs Number Math)
    • Explanation
  • JavaScript Funny Quiz
    • What does typeof NaN return?
    • What is [] == ![]?
    • “5” – – “2” equals:
    • Math.min() > Math.max() returns:
    • !!”false” === !!”true” is:
  • Should You Use These Tricks?
    • ✅ When They’re Helpful
    • ❌ When to Avoid
  • Final Thoughts to Share
  • Best Practices:
  • 🔗 Further Learning:

1. true + false = 1 (Boolean Arithmetic)

console.log(true + false); // 1
JavaScript Boolean Conversion in Math

Why This Happens

  • JavaScript converts booleans to numbers in math operations
  • true becomes 1
  • false becomes 0
  • So 1 + 0 = 1

Practical Example

Instead of:

let count = 0;
if (isAdmin) count++;
if (isModerator) count++;

You could write your code like below:

const count = isAdmin + isModerator;

📌 Note:

Though it works but difficult to read, it can be confusing. Use cautiously.

2. [] + {} = "[object Object]" (Strange Concatenation)

console.log([] + {}); // "[object Object]"
console.log({} + []); // 0 (in some browsers)

What’s Happening?

ExpressionConversionResult
[] + {}[] → "", {} → "[object Object]""" + "[object Object]"
{} + []{} as empty block, +[] → 00

3. 0.1 + 0.2 !== 0.3 (Floating-Point Puzzle)

console.log(0.1 + 0.2); // 0.30000000000000004

Why This Happens

Computers use binary floating-point which can’t perfectly represent decimals.

Solutions

MethodExample
toFixed()(0.1 + 0.2).toFixed(1)
Integer math(0.1*10 + 0.2*10)/10

💡 Tip:

Use decimal.js for financial calculations.

4. "b" + "a" + +"a" + "a" = "baNaNa"

console.log("b" + "a" + +"a" + "a"); // "baNaNa"
JS Failed Number Conversion

Breakdown

  1. "b" + "a" → "ba"
  2. +"a" → NaN (failed number conversion)
  3. "ba" + NaN + "a" → "baNaNa"

📌 Note:

Funny!! So never use in production right?

5. (!+[]+[]+![]).length === 9

console.log((!+[]+[]+![]).length); // 9

Step-by-Step Explanation

  1. +[] → 0
  2. !0 → true
  3. true + [] → "true"
  4. ![] → false
  5. "true" + "false" → "truefalse" (length 9)

⚠️ Warning: 

This is code is meaningless!

6. null > 0, null == 0, null >= 0 (Weird Comparisons)

console.log(null > 0);   // false
console.log(null == 0);  // false
console.log(null >= 0);  // true
weird JavaScript tricks #6

Why?

  • > and < convert null to 0
  • == doesn’t convert null except with undefined
  • >= uses > logic

📌 Rule:

Always use === for predictable comparisons.

7. "2" + "2" - "2" = 20 (String vs Number Math)

console.log("2" + "2" - "2"); // 20

Explanation

  1. "2" + "2" → "22" (string concatenation)
  2. "22" - "2" → 20 (subtraction forces number conversion)

💡 Tip:

Explicitly convert types with Number() or String()

JavaScript Funny Quiz

Test your knowledge:

What does typeof NaN return?

a) "number" ✅
b) "NaN"
c) "undefined"

What is [] == ![]?

a) true ✅
b) false
c) Error

"5" - - "2" equals:

a) 3
b) "3"
c) 7 ✅

Math.min() > Math.max() returns:

a) true ✅
b) false
c) Error

!!"false" === !!"true" is:

a) true ✅
b) false
c) Error

Answers: 1-a, 2-a, 3-c, 4-a, 5-a

Result?

Score 5/5? Share your result to challenge friends!

Should You Use These Tricks?

Lets judge what we should do?

✅ When They’re Helpful

  • Debugging type coercion issues
  • Understanding how JavaScript works

❌ When to Avoid

  • Production code
  • Team projects
  • Anywhere readability matters

📌 Pro Tip:

Configure ESLint with:

{
  "rules": {
    "no-implicit-coercion": "error",
    "eqeqeq": "error"
  }
}

Final Thoughts to Share

These interesting piece of code make JavaScript:

  • 🤯 Confusing at first
  • 🧠 Fascinating to master
  • 💡 Teachable moments about type systems

Best Practices:

  • Always use === over ==
  • Explicitly convert types when needed
  • Add comments when using non-obvious behavior

🔗 Further Learning:

  • JavaScript Equality Table
  • IEEE 754 Floating Point

Shawpnendu Bikash Maloroy
Shawpnendu Bikash Maloroy

🏋️‍♂️ Discover Code Blocks From 20+ yrs JS Expert
💥 Asp.net C# Developer
🏆 Solution Architect
👨‍✈️ Database Administrator
📢 Speaker
🎓 MCTS since 2009

Share this:

  • Click to share on Facebook (Opens in new window) Facebook
  • Click to share on X (Opens in new window) X

Spread the love
«Previous

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

  • 7 Weird JavaScript Tricks That Look Like Bugs
    7 Weird JavaScript Tricks That Look Like Bugs (#3 Will Shock You!)
  • Build a JavaScript Gamer Journal in 8 Lines
    🎮 Build a JavaScript Gamer Journal in 8 Lines: Track Your Wins Like a Pro! 🏆
  • JavaScript Pet Feeder Reminder in 7 Lines
    How to Code a Simple JavaScript Pet Feeder Reminder in 7 Lines: Feed Your Pet Like a Coding Boss! 🐶
  • 10-line calculator JavaScript
    Build a Simple Calculator in JavaScript: 10 Lines to Wow Your Friends!
  • JavaScript No-Code Automation
    JavaScript No-Code Automation: How to Replace Zapier with a Few Lines of Code

About-CodersTech Zone |  Contact |  Disclaimer |  Fact-Checking policy |  Affiliate Disclosure |  Privacy Policy

Copyright © 2024 CodersTechZone.com