Scott Van Vliet

Less Talk, More Rock

Simple Javascript Object Dump Function

In my years of doing Web development, I've written this function several times over; however, I can NEVER find the code when I need it!  Thus, here is a simple Javascript function to dump the contents of any object (posted to share, but also for my own permanent reference!)

 

<script language="javascript">

      

       var MAX_DUMP_DEPTH = 10;

      

       function dumpObj(obj, name, indent, depth) {

              if (depth > MAX_DUMP_DEPTH) {

                     return indent + name + ": <Maximum Depth Reached>\n";

              }

              if (typeof obj == "object") {

                     var child = null;

                     var output = indent + name + "\n";

                     indent += "\t";

                     for (var item in obj)

                     {

                           try {

                                  child = obj[item];

                           } catch (e) {

                                  child = "<Unable to Evaluate>";

                           }

                           if (typeof child == "object") {

                                  output += dumpObj(child, item, indent, depth + 1);

                           } else {

                                  output += indent + item + ": " + child + "\n";

                           }

                     }

                     return output;

              } else {

                     return obj;

              }

       }

      

</script>

 

This will spit out the contents of the object (and nested objects) to an indented string, which is useful when trying to inspect the contents of DOM, etc.  Note that a recursive method like this can be dangerous, so I’ve included a maximum depth flag, MAX_DUMP_DEPTH, to ensure your browser doesn’t get locked up in an infinite nested loop.

 

Enjoy!

Comments

Jim said:

Thank you. I have also rewritten this function many times.
# October 30, 2006 4:02 PM

mozilla said:

Thought u'd like it.

# March 22, 2007 9:20 PM

Paul Feakins said:

Hi, Firefox says it's a recursive loop even when I put the max depth to 1.

Any ideas?

# July 2, 2007 5:49 AM

NerdFusion » JavaScript tips said:

Pingback from  NerdFusion &raquo; JavaScript tips

# September 5, 2007 7:41 PM

jojo said:

Wonderful, thanks!  I've not only written this many times, but have forgotten how to write it even more times than that.  Found yours searching for how to write it yet again...thank you.

# December 22, 2007 8:03 AM

a said:

eh.. how do you use this?? I could of swore javascript had an inbuilt console write/dump() function

# February 7, 2008 12:57 PM

Steve Wamsley said:

Beautiful! Got my JS code to work in minutes with this lil' snippet instead of hours. Major kudos.

# September 22, 2008 10:53 AM

DK said:

I got the following exception when runningitunderfirefox 3.0.3

Error: [Exception... "Component returned failure code: 0x80004005 (NS_ERROR_FAILURE) [nsIDOMHistory.length]"  nsresult: "0x80004005 (NS_ERROR_FAILURE)"  location: "JS frame :: chrome://testextension/content/overlay.js :: dumpObj :: line 76"  data: no]

Source File: chrome://testextension/content/overlay.js

Line: 76

the line in question is "for (var item in obj)"

any ideas? will also look in javascript docs, but fear it is something to do with the firefox 3 implementation of javascript (1.8)

# October 4, 2008 8:39 AM
Leave a Comment

(required) 

(required) 

(optional)

(required)