DEV Community

loading...
Cover image for JavaScript is bananas

JavaScript is bananas

Daniel Rochetti
・2 min read

During one of these dev Twitter "Offend a JavaScript developer in one line of code." jokes, I replied with:

('b' + 'a' + + 'a' + 'a').toLowerCase();
Enter fullscreen mode Exit fullscreen mode

It's a good old joke about how JavaScript dynamic and forgiving type system handles some operations.

It's worth it calling out that I didn't come up with it. I don't even remember the first time I saw it, but it was interesting to notice the curiosity and confusion it created.

What's happening there?

Let's take a deeper look at what happens in each step of that line:

  1. 'b' is concatenated with 'a', resulting in 'ba' + + 'a' + 'a'. So far so good.
  2. Now things get interesting. The next expression is + + 'a'. The first + is a concatenation operation just like the previous one, but then it finds another + sign, followed by 'a', a string. The + 'a' is then evaluated as a unary operation, but since 'a' is not a number, JavaScript tries to convert it which results in a NaN, the JavaScript global property that indicates a failed numeric expression. Then it gets converted to a string, 'NaN', to complete the concatenation operation. Phew!
  3. Now we have 'baNaN' + 'a', which is the last step of the string concatenation, nothing unusual there.
  4. Last but not least, baNaNa.toLowerCase() gets rid of the NaN to make the joke less obvious.

The key thing happens in step #2. The expression + + 'a' is something that would be considered an invalid syntax in most languages, but JavaScript tries to guess what you're trying to accomplish and then things get weird.

JavaScript is very permissive when it comes to interaction between its different types. Whenever a string is present or an operation is happening between two incompatible types, JavaScript will try to transform everything to a string.

Of course this is a generalization and there are exceptions, but 1 + '1' === '11' (number + string) and [1, 2, 3] + 4 === '1,2,34' (array + number) are two good examples of such behavior.

JavaScript is bad

For years JavaScript wasn't taken seriously, often considered a bad scripting language that couldn't be avoided due how Browsers work.

Reality is the language has evolved quite a bit, it has an engaged community, a diligent development process through TC39, and it enables a variety of different solutions in all sorts of platforms and devices. However, that wasn't always the case and some of its (weird) early days behaviors remain the same.

I appreciate its power and all the products that were made possible due to its resilience and extensibility. These peculiarities will remain a good source of jokes for years to come nonetheless, and that is just another thing I love about the language.

Discussion (4)

Collapse
tilkinsc profile image
Cody Tilkins

JavaScript is bananas. B a n a n a s.

Collapse
icecoffee profile image
atulit023 • Edited

Earlier I was trying to make an error and I got this.lol

Collapse
drochetti profile image
Daniel Rochetti Author

haha yep, same root cause. The object gets converted to a string, "[object Object]" and then appended to the number, which is also converted to a string.

Long story short, when JS doesn't know what to do, it converts everything to a string and call it a day.

Collapse
jwp profile image
John Peters

Thanks for the humor!