Справочник методов console в JS

в 7:09, , рубрики: api, console, console api, console.log, javascript

Справочник методов console в JS - 1Со времён систематизации методов объекта console прошло достаточно много времени, некоторые браузеры получили поддержку недостающих ранее методов. Таблица вызывает естественный интерес у разрабочиков, поэтому — почему бы её не обновить, дополнив в одной статье описаниями?

Справочник методов console в JS - 2 Chrome Справочник методов console в JS - 3 Firebug Справочник методов console в JS - 4 Firefox Справочник методов console в JS - 5 IE Справочник методов console в JS - 6 Node.js Справочник методов console в JS - 7 Safari Справочник методов console в JS - 8 Opera
assert(expression[, object, ...])

Если выражение expression ложно, выводит console.error, иначе — ничего не выводит.
  ✓   ✓ (28.0+)     ✓   ✓   ±
clear()
Очищает окно консоли.
  ✓   ✓ -⊝-   -⊝-   ✓   ✓
count([object])

Выводит, сколько раз данный код был выполнен. Если необязательный аргумент object передан, то перед значением счётчика, выводится object.toString()**.
  ✓   ✓ (30.0+)   -⊝-   ✓ ± ...
debug(object[, object, ...])

Эквивалент console.log для совместимости со старым вариантом объекта console, когда .debug выводил дополнительно ссылку на строку кода, из которой он был вызван.
   равно .log()   ✓   ✓   ✓   -⊝-   ✓ ± ...
dir(object)

object выводится как Javascript-объект (для DOM-элементов — все их аттрибуты и методы). Похожим образом работает %O в console.log в Chrome.
  ✓   ✓ (8+) (9+)   ✓   ✓  
dirxml(object)

Выводится XML-код объекта.
  ✓   ✓ -⊝- (11+) -⊝-   ✓ ± ...
error(object[, object, ...])

Выводит ошибку и результат console.trace для места, откуда она была вызвана (не останавливая выполнение программы). Поддерживаются паттерны(%s, %d (%i), %f, %o, %O, %c), как в console.log.
  ✓ ± ... ± ... (8+)   ✓   ✓ ± ...
exception(object[, object, ...])
Эквивалент error()
  равно .error() -⊝- -⊝- (28+) -⊝-        -⊝- -⊝- -⊝-
group(object[, object, ...])

Начинает развёрнутую группу записей в консоли, которая вручную затем может сворачиваться. Группа оканчивается командой .groupEnd(). Поддерживаются паттерны (см. .log()).
  ✓   ✓ ± ... (11+) -⊝- (4+)   ✓
groupCollapsed(object[, object, ...])

Начинает изначально свёрнутую группу записей в консоли, которая вручную затем может разворачиваться. Группа оканчивается командой .groupEnd(). Поддерживаются паттерны (см. .log()).
  ✓   ✓ ± ... (9+) (11+) -⊝-   ✓ (5.1+)   ✓
groupEnd()

Обозначает конец группы.
  ✓   (9+) (11+) -⊝-   ✓ (4+)   ✓
Справочник методов console в JS - 9 Chrome Справочник методов console в JS - 10 Firebug Справочник методов console в JS - 11 Firefox Справочник методов console в JS - 12 IE Справочник методов console в JS - 13 Node.js Справочник методов console в JS - 14 Safari Справочник методов console в JS - 15 Opera
info(object[, object, ...])

Аналогична .log(), но оформляется в ином дизайне, для различения типов сообщений, например, для градации важности или для иного смыслового значения этой группы сообщений. Поддерживаются паттерны (описаны в .log()).
  ✓   ✓   ✓   ✓   ✓   ✓   ✓
log(object[, object, ...])

Выводит аргументы в консоль, разделяя пробелами. Самая популярная из команд console.

Поддерживает паттерны — специальные имена в первом аргументе, указывающие, что его надо использовать как шаблон, в который будут подставляться следующие аргументы вместо термов (как в printf() на С, но значительно проще). Примеры:

console.log('У Пети было %d %s',10,'яблок');
console.log('Пи равно %f',Math.PI);
console.log('%cКаждый %cОхотник %cЖелает%c знать где сидит фазан','color:red;','font-size:16px;color:orange;','background:black;color:yellow;','font:normal;color:normal;background:normal;');
console.log('body as DOM: %o',document.getElementsByTagName('body')[0]);
console.log('object: %O',{a:1,b:2});
console.log('body as Object: %O',document.getElementsByTagName('body')[0]);

Виды паттернов и тип данного, в который преобразуется значение подставляемого аргумента:
%s — строка.
%d или %i — число.
%f — число с плавающей точкой (Firebug тоже поддерживает).
%o — DOM-элемент (Firebug выводит как ссылку на элемент. Chrome, кроме ссылки, отображает элемент в консоли. Firefox по клику открывает элемент в модальном окне (доступны все аттрибуты и методы этого объекта)).
%O — JS-объект (не поддерживается в Firefox; Chrome преобразует DOM-объект в js-объект для этого паттерна; Firebug не отличает %o от %O).
%c — CSS-стиль (color, background, font, ...; не поддерживается в Firefox).

    (важно)   ✓   ✓   ✓   ✓   ✓   ✓ ± ...
markTimeline()

Аналог .timeStamp() для Safari, но в нём .timeStamp() не поддерживается, и наоборот.
 =.timeStamp() -⊝- -⊝- -⊝- -⊝- -⊝-   ✓ -⊝-
profile([label])

Запускает Javascript-профайлер, затем показывает результаты под именем «label».
  ✓   ✓ (devtools) (10+) -⊝-   ✓ -⊝-
profileEnd()

Выключает Javascript-профайлер.
  ✓   ✓ (devtools) (10+) -⊝-   ✓ -⊝-
table(data[, columns])

Двумерные табличные данные — в формате таблицы. Data — массив или объект (или объект из объектов, объект из массивов), каждый элемент которого будет строкой в таблице. Первый столбец двумерного массива будет его индексом (от 0). Или, если это — объект, первый столбец будет состоять из ключей объекта. Пример из Firefox (объект объектов):
Справочник методов console в JS - 16
  ✓   (34.0+) -⊝- -⊝- -⊝- -⊝-
time(label)

Включает счётчик (миллисекунд) под именем label.
  ✓ (10+) (11+)   ✓ (4+)   ±
timeEnd(label)

Останавливает счётчик (миллисекунд) под именем label и публикует результат под этим именем. Пример (Хром):
Справочник методов console в JS - 17
  ✓   (10+) (11+)   ✓ (4+)   ±
timeStamp([label])

Отрисовыввает метки времени на диаграмме таймингов скрипта, что позволяет следить за динамикой поведения программы. Пример (Firebug):
Справочник методов console в JS - 18
  ✓   -⊝- -⊝- -⊝- -⊝- -⊝-
trace()

Показывает стек трассировки функции на данный момент исполнения (то же, что обычно показывается при остановке на месте ошибки). Пример в Safari (в боковой панели), в Хроме (в консоли):
Справочник методов console в JS - 19 Справочник методов console в JS - 20
В Firefox:
Справочник методов console в JS - 21
  ✓   ✓ (10+) (11+)   ✓ (7.0.1+) ± ...
warn(object[, object, ...])

Аналогична .log() и .info(), но оформляется в ином дизайне, для различения типов сообщений. Поддерживаются паттерны (описаны в .log()).
  ✓   ✓   ✓   ✓   ✓   ✓   ✓
debugger;

Останавливает выполнение Javascript на текущей строке. Равносилен установке точки останова (breakpoint) в отладчике. Кроме остановки, никак не отражается на исполняемой программе.
  (оператор)   ✓   ✓   ✓   ✓   ✓   ✓   ✓
throw new Error('mesasge');

Останавливает выполнение Javascript на текущей строке, прерывая выполнение. (Поддерживается всеми средами исполнения Javascript.)
Справочник методов console в JS - 22 Chrome Справочник методов console в JS - 23 Firebug Справочник методов console в JS - 24 Firefox Справочник методов console в JS - 25 IE Справочник методов console в JS - 26 Node.js Справочник методов console в JS - 27 Safari Справочник методов console в JS - 28 Opera

Console API Reference for Chrome
Console API in Firebug
Console object (MDN)
Console object in IE10 (MSDN)
in Node.js v0.12.0
… in Safari Web Inspector Guide
Console in Opera Dragonfly

Используем console на полную
Продвинутая JavaScript отладка при помощи console.table()
Релиз Firebug 1.6 (console.table)
Using the F12 Tools Console to View Errors and Status (MSDN)

FireBug* Console API — описаны тонкости реализации, замеченные в тестах браузеров 2013 г;
API консоли Javascript

Автор: spmbt

Источник

* - обязательные к заполнению поля


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js