INTELLIGENT WORK FORUMS
FOR COMPUTER PROFESSIONALS

Log In

Come Join Us!

Are you a
Computer / IT professional?
Join Tek-Tips Forums!
  • Talk With Other Members
  • Be Notified Of Responses
    To Your Posts
  • Keyword Search
  • One-Click Access To Your
    Favorite Forums
  • Automated Signatures
    On Your Posts
  • Best Of All, It's Free!

*Tek-Tips's functionality depends on members receiving e-mail. By joining you are opting in to receive e-mail.

Posting Guidelines

Promoting, selling, recruiting, coursework and thesis posting is forbidden.

Jobs

Objects

How to show more detail about an object by BillyRayPreachersSon
Posted: 17 Jun 06 (Edited 17 Jun 06)

Normally when you alert a generic object in JavaScript, browsers do not give you wery much information. Values like "[Object]" are all too common, and not very informative.

The code below shows one way of resolving this. By adding a "toStringEnhanced" method to every object, it allows to you customise how you see object infotmation. It also handles objects within objects easily by using recursion.

CODE

<html>
<head>
    <script type="text/javascript">
    <!--

        // define basic object structure for a person, containing 2 strings and a date object
        function personDetails(personName, personEmail, personDOB) {
            this.name = personName;
            this.email = personEmail;
            this.DOB = personDOB;
        }

        // define object that will hold
        var peopleDetails = { person:[], someOtherStuffMightGoHere: 123 };

        // initialise data
        peopleDetails.person[0] = new personDetails('Fred Bloggs', 'fred@bloggs.com', new Date('01/01/1964'));
        peopleDetails.person[1] = new personDetails('Mike Raphone', 'mike@raphone.com', new Date('02/06/1968'));
        peopleDetails.person[2] = new personDetails('Ray Zin', 'ray@zin.com', new Date('09/03/1972'));

        var numPeople = peopleDetails.length;
        for (var loop=0; loop<numPeople; loop++) {
        }

        // add a more powerful method than "toString" to an object
        Object.prototype.toStringEnhanced = objToString;

        function objToString() {
            var s = '';

            for (properties in this) {
                var currentProperty = this[properties];
                var propertyType = (typeof(currentProperty)).toLowerCase();


                if (propertyType == 'function') {
                    // s += ' A function: ' + currentProperty + '\n';    // skip detail for methods. replace this line with "s += currentProperty;" to remove restriction
                    continue;
                }

                if (currentProperty.constructor == new Date().constructor) {
                    // for date objects, use default "toString()" method
                    s += properties + ': A date: ';
                    s += currentProperty;
                    s += '\n';
                } else if (currentProperty.constructor == [].constructor) {
                    // for array objects, use different description
                    s += properties + ': An array:\n\n';
                    s += currentProperty.toStringEnhanced();
                    s += '\n';
                } else if (propertyType == 'object') {
                    s += properties + ': ';
                    s += currentProperty.toStringEnhanced();
                    s += '\n';
                } else {
                    s += properties + ': ';
                    s += currentProperty;
                    s += '\n';
                }
            }

            return(s);
        }

        // show object detail with regular "toString()" method
        alert(peopleDetails);

        // show object detail with enhanced "toString()" method
        alert(peopleDetails.toStringEnhanced());

    //-->
    </script>
</head>

<body>
</body>
</html>

The code isn't as comprehensive as it could be (for example, indenting sub-levels, etc), but it gives a good idea of how to use recursion, and how to output different results based on the property / method type.

Dan

Coedit Limited - Delivering standards compliant, accessible web solutions

Dan's Page @ Code Couch
http://www.codecouch.com/dan/

Back to Javascript FAQ Index
Back to Javascript Forum

My Archive

Resources

Close Box

Join Tek-Tips® Today!

Join your peers on the Internet's largest technical computer professional community.
It's easy to join and it's free.

Here's Why Members Love Tek-Tips Forums:

Register now while it's still free!

Already a member? Close this window and log in.

Join Us             Close