[javascript] How can I view an object with an alert()

I tried to do a debug but I am having problems. Now I try with alert(). For example I want to see the value of:

var product = { ProductName: $('!Answer_Response[0]').val(),
                  UnitPrice: $('#Price').val(),
                  Stock: $('#Stock').val()
              };

When I say alert(product) it just gives me [object Object]. How can I make alert show what's really there?

This question is related to javascript jquery

The answer is


You should really use Firebug or Webkit's console for debugging. Then you can just do console.debug(product); and examine the object.


you can use toSource method like this

alert(product.toSource());

alert( JSON.stringify(product) );

If you want to easily view the contents of objects while debugging, install a tool like Firebug and use console.log:

console.log(product);

If you want to view the properties of the object itself, don't alert the object, but its properties:

alert(product.ProductName);
alert(product.UnitPrice);
// etc... (or combine them)

As said, if you really want to boost your JavaScript debugging, use Firefox with the Firebug addon. You will wonder how you ever debugged your code before.


This is what I use:

var result = [];
for (var l in someObject){
  if (someObject.hasOwnProperty(l){
    result.push(l+': '+someObject[l]);
  }
}
alert(result.join('\n'));

If you want to show nested objects too, you could use something recursive:

function alertObject(obj){
 var result = [];
 function traverse(obj){
 for (var l in obj){
   if (obj.hasOwnProperty(l)){
     if (obj[l] instanceof Object){
       result.push(l+'=>[object]');
       traverse(obj[l]);
     } else {
       result.push(l+': '+obj[l]);
     }
   }
  }
 }
 traverse(obj);
 return result;
}

Try this:

alert(JSON.parse(product) );

Use Javascript native JSON.stringify method. To visualise it in a nicer way, you can use, like: JSON.stringify(obj,null, 4)

_x000D_
_x000D_
var obj = {data:[{"empmenuid":"1","empid":null,"deptid":"66","aliasid":"66","firstname":"66","lastname":"66","sin":"66","status":"66","empclass":"66","hiredate":"66","seneoritydate":"66","separationdate":"66"},{"empmenuid":"3","empid":null,"deptid":"12","aliasid":"12","firstname":"12","lastname":"12","sin":"12","status":"12","empclass":"12","hiredate":"12","seneoritydate":"12","separationdate":"12","recalldate":"12","martialstatus":"12","gender":"12","pager":"12","locid":"12","jobtitle":"12","jobtitlestart":"12","fullpart":"12","manager":"12","managername":"12","middlename":"12","nickname":"12","paytype":"12","payfreq":"12"}],_x000D_
recordType : 'object'};_x000D_
_x000D_
alert(JSON.stringify(obj,null, 4));
_x000D_
_x000D_
_x000D_


alert (product.UnitName + " " + product.UnitPrice + " " + product.Stock)

or else create a toString() method on your object and call

alert(product.toString())

But I have to agree with other posters - if it is debugging you're going for then firebug or F12 on IE9 or chrome and using console.log is the way to go


Depending on which property you are interested in:

alert(product.ProductName);
alert(product.UnitPrice);
alert(product.Stock);