Search notes:

Browser Object Model: console object

The console object provides an API to a browser's debugging console (aka Web Console in Firefox.
From a browser, the debugging console can be opened with ctrl+shift+j (at least in Firefox). Chrome also opens the console with F12
2022-12-03: For a specific application rendered in a Chrome browser, I could not open the debugging console with ctrl+shift+j (why?), but was able to open it by pressing F12 then ESC.
console.log(…) allows to write messages into the debugging console.
console.table() prints data in tabular form.
With console.time(timerName) and the corresponding console.timeEnd(timerName), it's possible to crudly time the duration of a section of code.

Methods

assert()
clear() Clears the console (but has no effect on consoles running in a terminal (such as those running on Node)).
count()
countReset()
debug(), error(), info(), warn() Writes a debug/error/informational/warning message to the console. A debug message is only displayed to the user if the console is configured to display debug output
dir() displays an interactive list of the properties of the specified JavaScript object. To get a ist of methods of the Array object, try (directly in the console window): dir(.prototype). Is this method inspired by Python's dir()?
dirxml()
group(), groupEnd() Starts/ends an (indented) inline log group
groupCollapsed() Similar to group(), but the new group is created collapsed.
log()
profile(), profileEnd() Non-standard
table() Displays tabular data as table.
time(), timeEnd() Starts/ends a (named) timer which can be used to measure the time it takes for an operation to finish.
timeLog() Logs the current time for a currently running timer started with time()
timeStamp() Non-standard: Adds a marker to the browser's (Chrome, Firefox) Performance Tool.
trace() Prints a stack trace

console.group

<html>
<head>
  <meta charset="utf8">

<title>console.group</title>

<script type="text/JavaScript">
<!--


var out;

function bar(i) {

  console.group('g_bar');
  for (var j=0; j < i*3; j++) {
    console.log('j=' + j);
  }
  console.groupEnd('g_bar');
  
}

function foo() {

  console.group('g_foo');

  for (var i=0; i<3; i++) {

    console.log('i='+i);
    bar(i);

  }

  console.groupEnd('g_foo');
  
}

function main() {

  out = document.getElementById('out');
  foo();

}

//-->

</script>
</head>
<body onload='main()'>

  <div id='out'>
  </div>


</body>
</html>
Github repository Browser-Object-Model, path: /console/group.html

console.profile

<html>
<head>
  <meta charset="utf8">

<title>console.profile</title>

<script type="text/JavaScript">
<!--


var out;

function bar(j) {

  console.profile('p_bar');
  for (var i=0; i < 1e4 + 4e5; i++) {
    out.innerHTML = i;
  }
  console.profileEnd('p_bar');
  
}

function foo() {

  console.profile('p_foo');

  for (var i=0; i<3; i++) {

    bar(i);

  }

  console.profileEnd('p_foo');
  
}

function main() {

  out = document.getElementById('out');
  foo();

}

//-->

</script>
</head>
<body onload='main()'>

  <div id='out'>
  </div>


</body>
</html>
Github repository Browser-Object-Model, path: /console/profile.html

See also

window.console

Index