#BecauseJavaScript Part 3 – Undefined makes a comeback…

Here’s another post which explains why JavaScript behaves a certain way…

Regrettably, there are programmers baying for Brendan Eich’s blood because they don’t understand what is happening and just chalk it up to #BecauseJavaScript…

Let’s take a look at an example here:

Here, Vishal Gupta, has mentioned his befuddlement re the result he’s been given by JavaScript…

Vishal, I’m happy to take you on a guided tour on why JavaScript gave you “3” as your answer in this case.

Let’s take a look at the syntax:


Result: 3

So, we have a string ‘Befundefinedit’, being actioned by the indexOf method.

The only exception is that there’s no string value being passed as a parameter… You could say that parameter is undefined…

And you would be right, but at the sane time, the parameter is also undefined.

Yes, just because no value has been passed through doesn’t mean JavaScript will accept that at face value (no pun intended). JavaScript will consider what type of value is expected and coerce whatever has been passed through, even if the parameter passed is undefined. If it’s undefined, then JavaScript will be all like “Okay, buddy, you wanna go with an undefined value? We’ll try to work with you…” and then default value types and loose typing take over…

So in Vishal’s example, undefined is technically passed through the indexOf method, indexOf expects the parameter to be a string, so loose typing coerces undefined to become ‘undefined’ and uses that as its search term. In the string ‘Befundefinedit’ the search term ‘undefined’ appears at index 3 (remembering that strings, just like all arrays in JavaScript, are zero-based), and so it returns 3 as the final answer…

So, what’s our take away here? If a JavaScript method expects a parameter to be a specific type, a value of any other type that is passed to that method will be coerced to the expected type before execution. I’ll repeat this again, in quotes, because I can’t stress it enough…

If a JavaScript method expects a parameter to be a specific type, a value of any other type that is passed to that method will be coerced to the expected type before execution.

Another take away is that if a parameter is undefined, JavaScript will take you literally and go with undefined.

That being said, let’s go with a few more examples:

‘This is not a null string’.indexOf(null)

This returns 14. You guessed it, null just got coerced to a string and became ‘null’. The rest is pretty straight forward, as ‘null’ appears at index 14 of the string. I have to admit, I did have a little chuckle when I discovered this some time back.


This returns 9, as 0 after being coerced to ‘0’ is found at index 9 of the string.

x=(1!=0); ‘misconstrued as falsehoods’.indexOf(x)

This is a tricky one… I’ve predefined x with a Boolean value. We can see that I’ve cleverly put both ‘true’ and ‘false’ within the string. Which index will it return, 7 or 16? Keep your answer to yourself for just a little longer while we examine this one…

!= as everyone knows is the inequality operator in JavaScript. So, is 1 not equal to 0? Damn straight, so it’s true, so true is the value assigned to x. As x is passed to the indexOf method, it gets coerced to ‘true’ and the above syntax returns… 7. Hands up all those that got it right…

So what if we change it up a little?

x=(1!=0); ‘misconstrued as falsehoods’.indexOf(!x)

The only difference here is that we’ve passed through x which has also been acted upon by the negation operator, !. As a result, !x is passed, which means false its passed, which is coerced to ‘false’ which results in 16 being returned in this instance.

So, where do we go from here…? Just a reminder that if JavaScript gives you an answer that is perplexing; take a step back and look at how the syntax you’re using works, what it expects, and how loose typing may have come into play.

I have a doozy of a next post that will make your freaking heads spin coming soon. In the mean time, have a great day and stay quirky!


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s