console.log() Method: The console.log method simply yield a message to the console that can be used to display some kind of information to the user. That message can be a type of object or a string or an array. It’s like a troubleshooting tool in JavaScript.
Syntax:
console.log( message )
Parameters: This method accepts a single parameter which can be an array, an object or any message.
Return value: This method returns the value of the given parameter.
Example:
<!DOCTYPE html> <html> <head> <title>console.log() method</title> <style> h1 { color:green; } body { text-align:center; } </style> </head> <body> <h1>GeeksforGeeks</h1> <h2>console.log() Method</h2> <h3> Open console using F12 or Ctrl+Shift+I <h3> <script> var geek = { course : "DSA", price : "5000" }; console.log(geek); </script> </body> </html> |
Output:

console.dir() Method: The console.dir() method is used to get the list of object properties of a specified object. These object properties also have child objects, from which you can inspect for further information.
Syntax:
console.dir( object )
Parameters: This method accepts single parameter which holds the object element.
Example:
<!DOCTYPE html> <html> <head> <title>console.dir() method</title> <style> h1 { color:green; } body { text-align:center; } </style> </head> <body> <h1>GeeksforGeeks</h1> <h2>console.dir() Method</h2> <h3> Open console using F12 or Ctrl+Shift+I <h3> <script> var geek = { course : "DSA", price : "5000" }; console.dir(geek); </script> </body> </html> |
Output:

Note: The output of console.log() method is similar to HTML-like result while the output of console.dir() method is similar to JSON-like tree.
Example:
<!DOCTYPE html> <html> <head> <title>console.dir() method</title> <style> h1 { color:green; } body { text-align:center; } </style> </head> <body> <h1>GeeksforGeeks</h1> <h2>console.dir() Method</h2> <h3> Open console using F12 or Ctrl+Shift+I <h3> <script> console.dir(document.body); console.log(document.body); </script> </body> </html> |
Output:



