Javascript Object investigation

Question

UPDATED FROM ORIGINAL QUESTION

I am trying to learn what a javascript object 'looks like' by viewing it's properties like so:

//create object without prototype
var obj = Object.create(null);
//add properties
obj.a = 3;
obj.b = 76.3;
obj.c = { a : 23 , b : true , c : 1};
obj.s = "ABC!";
//output string
var outStr = new String();

for(var prop in obj)
{
    outStr += "Property " + prop + " is a " + typeof(obj[prop]) + " with value " + obj[prop] + "\n";

    for(var prop1 in obj[prop])
    {
        outStr += "Property " + prop1 + " is a " + typeof(obj[prop][prop1]) + " with value " + obj[prop][prop1] + "\n";
        for(var prop2 in obj[prop][prop1])
        {
            outStr += "Property " + prop2 + " is a " + typeof(obj[prop][prop1][prop2]) + " with value " + obj[prop][prop1][prop2] + "\n";
            for(var prop3 in obj[prop][prop1][prop2])
            {
                outStr += "Property " + prop3 + " is a " + typeof(obj[prop][prop1][prop2][prop3]) + " with value " + obj[prop][prop1][prop2][prop3] + "\n";
                for(var prop4 in obj[prop][prop1][prop2][prop3])
                {
                    outStr += "Property " + prop4 + " is a " + typeof(obj[prop][prop1][prop2][prop3][prop4]) + " with value " + obj[prop][prop1][prop2][prop3][prop4] + "\n";
                }
            }
        }
    }
}   

alert(outStr);

Which gives output:

Property a is a number with value 3
Property b is a number with value 76.3
Property c is a object with value [object Object]
  Property a is a number with value 23
  Property b is a boolean with value true
  Property c is a number with value 1
Property s is a string with value ABC!
  Property 0 is a string with value A
  Property 0 is a string with value A
  Property 0 is a string with value A
  Property 0 is a string with value A
  Property 1 is a string with value B
  Property 0 is a string with value B
  Property 0 is a string with value B
  Property 0 is a string with value B
  Property 2 is a string with value C
  Property 0 is a string with value C
  Property 0 is a string with value C
  Property 0 is a string with value C
  Property 3 is a string with value !
  Property 0 is a string with value !
  Property 0 is a string with value !
  Property 0 is a string with value !

Now this behaves exactly as I expect for every property except the String property obj.s = "ABC!";

I understand that obj.s contains the properties (keys and values):

"0" = "A"

"1" = "B"

"2" = "C"

"3" = "!"

And from a previous answer (thank you very much @pimvdb and @deestan) I gather that because each of these property values are strings they too each contain the property key "0" which itself must then also contain the property key "0" etc, etc? which is why I am getting the additional lines written out for the string property.

So my question now becomes:

Should the type of value of all properties at some point eventually revert to a primitive type like number or boolean to stop this recursive chain? I am thinking of the memory that actually holds this object and when I started writting this small test script to 'look' at the object I basically wanted to see all the primitives and how the object stored them, but there can't actually be an infinite allocation of string to string to string ... I imagine that it is just stored as the string object with it's 4 characters (or 5 if theres an end of string character too \0)

Deestan · Accepted Answer · 2012-03-09 13:14:16Z

3

Maybe not an answer to the question as posted, but I consider this an answer to your actual problem: :)

Install Chrome and open the Javascript Console (CTRL+SHIFT+J). There you can create objects and inspect them visually from the Javascript debugger.

> x = "stringystringstring"
  "stringystringstring"
>

Then in the upper right, add x to "Watch Expressions" to inspect it.

As you can see, x as a string isn't very interesting, so let's make it more complex:

> x = { a: "b" }
|> Object
>

Refresh the Watch Expressions and expand x to see the object structure. It should look something like this:

v x: Object
    a: "b"
  v __proto__: Object
    |> __defineGetter__: function __defineGetter__()...
    |> __defineSetter__: function __defineSetter__()...
    ...
    |> valueOf: function valueOf() { [native code] }

What we learn from this is that the object x has one property, and a bunch of methods inherited from the Object prototype.

If you need to see all properties and methods accessible to e.g. strings, type "derp". in the console. After half a second, an autocomplete list showing all available properties should appear.

answered Mar 9, 2012 at 13:14

Deestan

17.3k4 gold badges35 silver badges48 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Daniel Robinson Over a year ago

thank you this was very helpful answer I will certainly use the javascript console from now on.

pimvdb · Accepted Answer · 2012-03-09 12:58:40Z

2

You're iterating the keys of "ABC!" first. For each property (letter), you're iterating the key (there is one property for a one-letter string), which is "0" (keys are always strings). This string contains of one property, which has key "0" (because it's the first and only character) and value "0" (the key of the previous level). You're doing the exact same thing on this property, so you'll end up with a string 0 0 'recursion' pattern.

I'm not sure why you expect to stop after 2 levels, because the string "A" can still be inspected the same way as "ABC!" - in fact, your method would never halt if I'm understanding you correctly.

edited Mar 9, 2012 at 12:58

answered Mar 9, 2012 at 12:51

pimvdb

155k80 gold badges313 silver badges358 bronze badges

2 Comments

Daniel Robinson Over a year ago

thanks, that really helped, I have changed to loop over the value now rather than the key, which still produces the same problem as the value is also of type string so I end up with the appearance of an infinte number of string "0" pointing to each character from the original string :S

pimvdb Over a year ago

@Danny R: Using the value instead of the key won't really help I guess since "ABC!" will produce "A", and you'll be iterating over the "A" infinitely ("ABC!" contains "A", which contains "A", ...). You could, of course, stop at one-letter strings, but that's not really a satisfactory method.

Collectives™ on Stack Overflow

Javascript Object investigation

2 Answers 2

1 Comment

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related