console: table() static method

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

Note: This feature is available in Web Workers.

The console.table() static method displays tabular data as a table.

Syntax

js
console.table(data)
console.table(data, columns)

Parameters

data

The data to display. This must be either an array or an object. Each item in the array, or property in the object, is represented by a row in the table. The first column in the table is labeled (index) and its values are the array indices or the property names.

If the elements in the array, or properties in the object, are themselves arrays or objects, then their items or properties are enumerated in the row, one per column.

Note that in Firefox, console.table() is limited to displaying 1000 rows, including the heading row.

columns Optional

An array which can be used to restrict the columns shown in the table. It contains indices, if each entry of data is an array, or property names, if each entry of data is an object. The resulting table then includes only columns for items which match the given indices or names.

Return value

None (undefined).

Examples

Collections of primitive types

The data argument may be an array or an object.

js
// an array of strings

console.table(["apples", "oranges", "bananas"]);
(index) Values
0 'apples'
1 'oranges'
2 'bananas'
js
// an object whose properties are strings

function Person(firstName, lastName) {
  this.firstName = firstName;
  this.lastName = lastName;
}

const me = new Person("Tyrone", "Jones");

console.table(me);
(index) Values
firstName 'Tyrone'
lastName 'Jones'

Collections of compound types

If the elements in the array, or properties in the object, are themselves arrays or objects, then their elements or properties are enumerated in the row, one per column:

js
// an array of arrays

const people = [
  ["Tyrone", "Jones"],
  ["Janet", "Smith"],
  ["Maria", "Cruz"],
];
console.table(people);
(index) 0 1
0 'Tyrone' 'Jones'
1 'Janet' 'Smith'
2 'Maria' 'Cruz'
js
// an array of objects

function Person(firstName, lastName) {
  this.firstName = firstName;
  this.lastName = lastName;
}

const tyrone = new Person("Tyrone", "Jones");
const janet = new Person("Janet", "Smith");
const maria = new Person("Maria", "Cruz");

console.table([tyrone, janet, maria]);

If the array contains objects, then the columns are labeled with the property name.

(index) firstName lastName
0 'Tyrone' 'Jones'
1 'Janet' 'Smith'
2 'Maria' 'Cruz'
js
// an object whose properties are objects

const family = {};

family.mother = new Person("Janet", "Jones");
family.father = new Person("Tyrone", "Jones");
family.daughter = new Person("Maria", "Jones");

console.table(family);
(index) firstName lastName
daughter 'Maria' 'Jones'
father 'Tyrone' 'Jones'
mother 'Janet' 'Jones'

Restricting the columns displayed

By default, console.table() lists all elements in each row. You can use the optional columns parameter to select a subset of columns to display:

js
// an array of objects, logging only firstName

function Person(firstName, lastName) {
  this.firstName = firstName;
  this.lastName = lastName;
}

const tyrone = new Person("Tyrone", "Jones");
const janet = new Person("Janet", "Smith");
const maria = new Person("Maria", "Cruz");

console.table([tyrone, janet, maria], ["firstName"]);
(index) firstName
0 'Tyrone'
1 'Janet'
2 'Maria'

Specifications

Specification
Console Standard
# table

Browser compatibility

BCD tables only load in the browser

See also