How to get an object's properties in JavaScript / jQuery?

Question

In JavaScript / jQuery, if I alert some object, I get either [object] or [object Object]

Is there any way to know:

1. what is the difference between these two objects

2. what type of Object is this

3. what all properties does this object contains and values of each property

?

Answer 1

You can look up an object's keys and values by either invoking JavaScript's native for in loop:

var obj = {     foo:    'bar',     base:   'ball' };  for(var key in obj) {     alert('key: ' + key + '\n' + 'value: ' + obj[key]); } 

or using jQuery's .each() method:

$.each(obj, function(key, element) {     alert('key: ' + key + '\n' + 'value: ' + element); }); 

With the exception of six primitive types, everything in ECMA-/JavaScript is an object. Arrays; functions; everything is an object. Even most of those primitives are actually also objects with a limited selection of methods. They are cast into objects under the hood, when required. To know the base class name, you may invoke the Object.prototype.toString method on an object, like this:

alert(Object.prototype.toString.call([])); 

The above will output [object Array].

There are several other class names, like [object Object], [object Function], [object Date], [object String], [object Number], [object Array], and [object Regex].