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

от автора

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

Chrome Firebug Firefox  IE Node.js Safari 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+)   ✓
Chrome Firebug Firefox IE Node.js Safari 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 (объект объектов):
  ✓   (34.0+) -⊝- -⊝- -⊝- -⊝-
time(label)

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

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

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

Показывает стек трассировки функции на данный момент исполнения (то же, что обычно показывается при остановке на месте ошибки). Пример в Safari (в боковой панели), в Хроме (в консоли):

В Firefox:
  ✓   ✓ (10+) (11+)   ✓ (7.0.1+) ± …
warn(object[, object, …])

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

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

Останавливает выполнение Javascript на текущей строке, прерывая выполнение. (Поддерживается всеми средами исполнения Javascript.)
Chrome Firebug Firefox IE Node.js Safari 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

ссылка на оригинал статьи http://habrahabr.ru/post/253359/


Комментарии

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *