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
Nextยป

Good to Know

  • Stop Using These 3 Outdated JavaScript Tricks (Modern Alternatives Inside!)JavaScript best practices
  • 10 JavaScript Tricks That Will Blow Your Mind! ๐Ÿš€โœจ10 JavaScript Tricks - That Will Blow Your Mind!
  • JavaScript AI Hacks: How to Use AI for Coding in 2025 ๐Ÿš€๐Ÿค–JavaScript AI Hacks: How to Use AI for Coding in 2025
  • ๐Ÿ”ฅ Top 5 JavaScript Trends That Will DOMINATE 2025 ๐Ÿš€JavaScript Trend 2025
  • Comment in Javascript: How to Comment in JavascriptComment in Javascript: How to Comment in Javascript
  • 10 JavaScript One-Liners That Will Blow Your Mind in 202510 JavaScript One-Liners That Will Blow Your Mind in 2025

Leave a Reply Cancel reply

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

  • 5 Lesser-Known JavaScript Functions
    5 Lesser-Known JavaScript Functions to Boost Your Coding Efficiency
  • 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!

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

Copyright ยฉ 2024 CodersTechZone.com