Console.table()
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.
Не стандартно: Эта возможность не является стандартной и стандартизировать её пока никто не собирается. Не используйте её на сайтах, смотрящих во внешний мир: она будет работать не у всех пользователей. Также могут присутствовать большие несовместимости между реализациями и её поведение может в будущем измениться.
Отображает наборы данных в виде таблицы.
Данная функция принимает один обязательный аргумент data
, который должен быть представлен в виде массива или объекта, и один дополнительный параметр columns
.
функция логирует аргумент data
в виде таблицы. Каждый элемент массива (или каждое свойство, если data -
это объект) будет представлять строку таблицы.
Первая колонка таблицы будет озаглавлена как (index)
. Если data
представлена массивом, тогда значения первой колонки будут представлять индексы массива. Если data-
объект, тогда значения первой колонки будут представлять свойства объекта.
Примечание: Эта возможность доступна в Web Workers.
Простые наборы
Аргумент data
может быть массивом или объектом.
// массив строк
console.table(["apples", "oranges", "bananas"]);
// объект, чьи свойства содержат строки
function Person(firstName, lastName) {
this.firstName = firstName;
this.lastName = lastName;
}
var me = new Person("John", "Smith");
console.table(me);
Наборы смешанных типов
Если элементы массива, либо свойства объекта, в свою очередь сами являются массивами или объектами, тогда эти элементы или свойства перечисляются построчно, перечисляя вложенные элементы/свойства в колонках:
// массив массивов
var people = [
["John", "Smith"],
["Jane", "Doe"],
["Emily", "Jones"],
];
console.table(people);
// массив объектов
function Person(firstName, lastName) {
this.firstName = firstName;
this.lastName = lastName;
}
var john = new Person("John", "Smith");
var jane = new Person("Jane", "Doe");
var emily = new Person("Emily", "Jones");
console.table([john, jane, emily]);
Обратите внимание, что если массив состоит из объектов, колонки таблицы будут озаглавлены названиями свойств объекта.
// объект, свойства которого являются объектами
var family = {};
family.mother = new Person("Jane", "Smith");
family.father = new Person("John", "Smith");
family.daughter = new Person("Emily", "Smith");
console.table(family);
Ограничение видимости колонок
По умолчанию, console.table()
отображает все элементы в каждой строке. Вы можете использовать опциональный параметр columns
чтобы указать набор отображаемых колонок:
// массив объектов, логируется только свойство firstName
function Person(firstName, lastName) {
this.firstName = firstName;
this.lastName = lastName;
}
var john = new Person("John", "Smith");
var jane = new Person("Jane", "Doe");
var emily = new Person("Emily", "Jones");
console.table([john, jane, emily], ["firstName"]);
Сортировка колонок
Вы можете отсортировать необходимую колонку, кликнув по её заголовку.
Синтаксис
console.table(data [, columns]);
Параметры
Спецификации
Specification |
---|
Console Standard # table |
Совместимость с браузерами
BCD tables only load in the browser