Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript JavaScript Foundations Functions Return Values

huckleberry
huckleberry
14,636 Points

Re: code challenge: "Typeof and you: The mystery behind 'number', 'undefined' & 'string' as the value"

Hello all you budding, burdgeoning and blossoming scripters out there!

I have a question regarding the code challenge and the associated "typeof" operator.

Here's my solution

      function arrayCounter(array){
        if (typeof array === 'undefined' || typeof array === 'number' || typeof array === 'string' || array === 0){
            return 0;
          }
        return array.length;
      }

It works swimmingly but I had a bit of a problem figuring it out with just what we've learned for two reasons.

  1. No proper explanation of <code>typeof</code>
  2. actually, that's it...

The || operator has been explained elsewhere so I don't see a problem with expecting you to know that, but what I initially tried was this...

      function arrayCounter(array){
        if (typeof array === 'undefined' || typeof array === number || typeof array === string || array === 0){
            return 0;
          }
        return array.length;
      }

I had thought that you would use the keywords number and string. I understood from the video that you would use typeof array === 'undefined' with undefined wrapped in quotes but I did not think that number or string would also be wrapped in quotes.

Here was my thinking.

The word undefined gets returned as a value so it made sense that "ok, it compares array to the string 'undefined' so we wrap that in quotes and it works" but in wrapping the word string and number in quotes... that's where the logic of the whole thing escaped me.

I read the other thread and have learned that the better method is array.isArray(); but that was never taught and I have no issues with that not being taught as of yet. They were asking us to figure out how to do it with what we know and that as a teaching method is just fine. Plus, they did literally tell us in the code challenge specifications to use 'string' and 'number' in quotes although they didn't specifically say "make sure the words are wrapped in quotes as we've written here"

But anyway, my problem is this... what the heck does typeof actually do? How does it compare a number to a string value for example? You're literally telling the program to compare the type of data that exists in the argument that was passed but in each instance you're comparing it to a word that is a string.

So WHAT is the actual code that gets run via typeof? Now I'm figuring that it pulls in the data from the associated parameter that follows it (in this case the array parameter defined in the function) and then outputs a single word string based on what it finds... but what is the underlying CODE behind typeof? Is there anyway to find that out? Are we able to, somewhere, find the function that typeof runs to evaluate the data passed to it? How does it operate and what does it do to the data it receives to output those one word strings of 'undefined', 'string' and 'number'?

I guess that I don't REALLY have to know as long as I know how to use it, but that's how I work and it just bugs me until I know how the inner workings of a tool that I'm using actually does its job.

Thanks for any help or comments!

Cheers,

Huck - :sunglasses:

I just wanted the answer for the arrayss challenge

3 Answers

Hey Huckster!

The typeof operator doesn't compare two values of a variable; it just returns what type of variable the variable is. It compares the types of a variable with a return value in the form of a string. And, typeof returns arrays as objects, because they are technically objects, just very specific objects that use numbered keys for its values. As you heard, isArray() is a much better function to test to see if the variable is an array or not.

If you ever get confused about what something in the Web API does, for plain JavaScript use the MDN: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/typeof. That article has examples of what typeof returns and explains in detail what it does. If we were talking about jQuery, I'd direct you to the jQuery API site: http://api.jquery.com.

huckleberry
huckleberry
14,636 Points

Heeeey there Marcus,

Thanks for the reply!

Yeah that page in the documentation is what got me understanding that "ok, it just returns a value in the form of a string based upon what type of structure the input is (i.e. string, object, number, undefined)" and that's why we compare it with the strings "number" "string" "undefined". That article has everything I do need in order to use it properly although I'd still love to see the actual underlying code for "typeof". I'd be interested to know how it processes the input it's analyzing.

Nice clear and concise explanation of it that you gave though.

Is there a place out there that shows you the "behind the scenes" code for the built in stuffs like that??

Thanks dude!

Cheers,

Huck - :sunglasses:

huckleberry
huckleberry
14,636 Points

Ok, so it turns out -- and little did I know lol -- that what I needed to explain the inner workings of the typeof operator was the actual ECMA5 specifications...

so it turns out that typeof is an unary expression that evaluates blah blah based on getValue() and etc..etc.. returns a value in string from ... and that's what I know and I need ibuprofen now.

Cheers,

Huck - :confounded:

p.s. if anything could make me stop asking questions, it's that EMCA script specifications doc.

Haha excellent find, Huck! I only knew how typeof worked, but now why it worked. And I think I may need to partake of that very same bottle as my head has suddenly come under attack :D Hopeful happy coding to you, sir!

Jonathan Grieve
MOD
Jonathan Grieve
Treehouse Moderator 91,252 Points

I don't know precisely how it works but it's basically a handy keyword that can help you identify a data type and it's value which is good for debugging!

The mystery if what makes code work, how and why fascinates me though :)

huckleberry
huckleberry
14,636 Points

yeah I now realize the value of it and that's fantastic. I just wish it wasn't like, glossed over in the videos ya know?

And yes, it does for me too... the mystery and fascination. I spent an hour or more the other night on a detour to learn about sorting because in the array video he's all

"oh you use this function with 2 arguments and then in the function you go a-b blah blah " and I'm like WAIT... how the ... HOW does a 2 argument function successfully navigate an array with hundreds or even thousands of elements? WHAT IS IT DOING??

Which, you know, let me to various documentation and articles describing various sort methods and the popular & simple bubble sort method and once it finally made sense WHAT the sort method was doing. So that lead me to have that "aha" moment of "don't forget, Huck, these methods and built in functions all have larger structures underneath that you can't see that is doing all the work"

And now I wanna know what they do :(.

Anyway, thanks for your input! :)

Cheers,

Huck - :sunglasses: