What is console.log?

Question

What is the use of console.log?

Please explain how to use it in JavaScript, with a code example.

Answer 1

This is nothing to deal with the jQuery. The console.log() is referencing to the console object's log function, which provides methods for logging information to the browser's console. These methods are intended for debugging purposes only and should not be relied on for presenting information to end users.

Answer 2

Beware: leaving calls to console in your production code will cause your site to break in Internet Explorer. Never keep it unwrapped. See: https://web.archive.org/web/20150908041020/blog.patspam.com/2009/the-curse-of-consolelog

Answer 3

I really feel web programming easy when i start console.log for debugging.

var i;

If i want to check value of i runtime..

console.log(i);

you can check current value of i in firebug's console tab. It is specially used for debugging.

Answer 4

It's not a jQuery feature but a feature for debugging purposes. You can for instance log something to the console when something happens. For instance:

$('#someButton').click(function() {
  console.log('#someButton was clicked');
  // do something
});

You'd then see #someButton was clicked in Firebug’s “Console” tab (or another tool’s console — e.g. Chrome’s Web Inspector) when you would click the button.

For some reasons, the console object could be unavailable. Then you could check if it is - this is useful as you don't have to remove your debugging code when you deploy to production:

if (window.console && window.console.log) {
  // console is available
}

Answer 5

Quoting MDN Docs here

console — contains many methods that you can call to perform rudimentary debugging tasks, generally focused around logging various values to the browser's Web Console.

By far the most commonly-used method is console.log, which is used to log the current value contained inside a specific variable.

How to use in Javascript?

let myString = 'Hello World';
console.log(myString);

Also remember console is a part of global window object in the web browser. Thus the following is also technically correct but isn't used in practical scenario.

let myString = 'Hello World';
window.console.log(myString);

Answer 6

It will post a log message to the browser's javascript console, e.g. Firebug or Developer Tools (Chrome / Safari) and will show the line and file where it was executed from.

Moreover, when you output a jQuery Object it will include a reference to that element in the DOM, and clicking it will go to that in the Elements/HTML tab.

You can use various methods, but beware that for it to work in Firefox, you must have Firebug open, otherwise the whole page will crash. Whether what you're logging is a variable, array, object or DOM element, it will give you a full breakdown including the prototype for the object as well (always interesting to have a poke around). You can also include as many arguments as you want, and they will be replaced by spaces.

console.log(  myvar, "Logged!");
console.info( myvar, "Logged!");
console.warn( myvar, "Logged!");
console.debug(myvar, "Logged!");
console.error(myvar, "Logged!");

These show up with different logos for each command.

You can also use console.profile(profileName); to start profiling a function, script etc. And then end it with console.profileEnd(profileName); and it will show up in you Profiles tab in Chrome (don't know with FF).

For a complete reference go to http://getfirebug.com/logging and I suggest you read it. (Traces, groups, profiling, object inspection).

Hope this helps!