Question

I am trying to learn debugging Javascript in Chrome’s Javascript console. However, I don’t understand how the console displays the data type of an object . For instance, in the Javascript Console, it shows this:

In this picture, I am using JQuery. I tried to do a console.log on a few variables but how do I know if a particular variable is a JQuery object or a raw DOM object? Is the HTMLDivElement or the other one that shows the div tag listed in the console a JQuery object or a raw DOM object?

In general, how should I know the data type of an object or variable in Javascript in a debugger console like the Chrome’s Javascript console? In languages such as Java, the data type of a variable is shown clearly in the debugger; I can know from the debugger what kind of object the variable is, whether it is an instance of Class A or instance of Class B, etc.

Answer 1

if (variable instanceof jQuery) // Or variable.jquery 
    // jQuery object.

Live DEMO

instanceof docs on MDN:

The instanceof operator tests whether an object has in its prototype chain the prototype property of a constructor.

---

The way jQuery checks for DOM elements is with nodeType:

// Handle $(DOMElement)
if ( selector.nodeType ) {

The way jQuery checks for jQuery object is with the jquery property:

// HANDLE: $(expr, $(...))  
else if ( !context || context.jquery ) {