Таблица вызывает естественный энтузиазм у разрабочиков, потому — почему бы её не обновить, дополнив в одной статье описаниями? Со времён систематизации способов объекта 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()
✓
✓
✓
✓
-⊝-
✓
± …
Схожим образом работает %O в console.log в Chrome. dir(object)object выводится как Javascript-объект (для DOM-частей — все их аттрибуты и способы).
✓
✓
✓ (8+)
✓ (9+)
✓
✓
✓
dirxml(object)Выводится XML-код объекта.
✓
✓
-⊝-
✓ (11+)
-⊝-
✓
± …
Пример с трассировкой стека вызовов (Firefox 31+): Поддерживаются паттерны(%s, %d (%i), %f, %o, %O, %c), как в console.log. error(object[, object, …])Выводит ошибку и итог console.trace для места, откуда она была вызвана (не останавливая выполнение программы).
✓
± …
✓
✓ (8+)
✓
✓
± …
exception(object[, object, …])Эквивалент error()
равно .error()
-⊝-
-⊝-
✓ (28+)
-⊝-
-⊝-
-⊝-
-⊝-
.log()). Группа оканчивается командой .groupEnd(). group(object[, object, …])Начинает развёрнутую группу записей в консоли, которая вручную потом может сворачиваться. Пример кода и результата (из статьи "Способности консоли браузера", 2013): Поддерживаются паттерны (см.
console.group("module A")
console.log(‘a’)
console.log(‘a’)
console.log(‘a’)
console.group("nested module B")
console.log(‘b’)
console.log(‘b’)
console.log(‘b’)
console.groupEnd()
console.groupCollapsed("nested collapsed module C")
console.log(‘c’)
console.log(‘c’)
console.log(‘c’)
console.groupEnd()
console.groupEnd()
console.group("module D")
console.log(‘d’)
console.log(‘d’)
console.log(‘d’)
console.groupEnd()
✓
✓
± …
✓ (11+)
-⊝-
✓ (4+)
✓
Поддерживаются паттерны (см. .log()). groupCollapsed(object[, object, …])Начинает вначале свёрнутую группу записей в консоли, которая вручную потом может разворачиваться. Группа оканчивается командой .groupEnd().
✓
✓
(9+) ± …
✓ (11+)
-⊝-
✓ (5.1+)
✓
groupEnd()Обозначает конец группы.
✓
✓
✓ (9+)
✓ (11+)
-⊝-
✓ (4+)
✓
Chrome
Firebug
Firefox
IE
Node.js
Safari
Opera
Поддерживаются паттерны (описаны в .log()). info(object[, object, …])Подобна .log(), но оформляется в ином дизайне, для различения типов сообщений, к примеру, для градации значимости либо для другого смыслового значения данной группы сообщений.
✓
✓
✓
✓
✓
✓
✓
Самая популярная из команд console. log(object[, object, …])Выводит аргументы в консоль, разделяя пробелами.
Поддерживает паттерны — особые имена в первом аргументе, указывающие, что его нужно применять как шаблон, в который будут подставляться последующие аргументы заместо термов (как в 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 (Firefox): %c — CSS-стиль (color, background, font; не поддерживается в Firefox).
(принципиально)
✓
✓
✓
✓
✓
✓
± …
markTimeline()Аналог .timeStamp() для Safari, но в нём .timeStamp() не поддерживается, и напротив.
=.timeStamp()
-⊝-
-⊝-
-⊝-
-⊝-
-⊝-
✓
-⊝-
profile([label])Запускает Javascript-профайлер, потом указывает результаты под именованием «label».
✓
✓
(devtools)
✓ (10+)
-⊝-
✓
-⊝-
profileEnd()Выключает Javascript-профайлер.
✓
✓
(devtools)
✓ (10+)
-⊝-
✓
-⊝-
table(data[, columns])Двумерные табличные данные — в формате таблицы. 1-ый столбец двумерного массива будет его индексом (от 0). Data — массив либо объект (либо объект из объектов, объект из массивов), каждый элемент которого будет строчкой в таблице. Либо, раз это — объект, 1-ый столбец будет состоять из ключей объекта. Пример из Firefox (объект объектов):
Columns — доп массив заглавий колонок для заголовков таблицы, раз строчки сделаны из массивов, а мы не желаем, чтоб наименованиями были числовые индексы. Ниже — что было бы из массива массивов без параметра columns: Выше — был пример результата (Firefox), приобретенного либо из именованных колонок, либо из объекта объектов.
✓
✓
✓ (34.0+)
-⊝-
-⊝-
-⊝-
-⊝-
time(label)Включает счётчик (миллисекунд) под именованием label.
✓
✓
✓ (10+)
✓ (11+)
✓
✓ (4+)
±
timeEnd(label)Останавливает счётчик (миллисекунд) под именованием label и публикует итог под сиим именованием. Пример (Хром):
✓
✓
✓ (10+)
✓ (11+)
✓
✓ (4+)
±
Пример (Firebug): timeStamp([label])Отрисовыввает метки времени на диаграмме таймингов скрипта, что дозволяет смотреть за динамикой поведения программы.
✓
✓
-⊝-
-⊝-
-⊝-
-⊝-
-⊝-
Пример в Safari (в боковой панели), в Хроме (в консоли): trace()Указывает стек трассировки функции на данный момент выполнения (то же, что традиционно показывается при остановке на месте ошибки).
В Firefox:
✓
✓
✓ (10+)
✓ (11+)
✓
✓ (7.0.1+)
± …
Поддерживаются паттерны (описаны в .log()). warn(object[, object, …])Подобна .log() и .info(), но оформляется в ином дизайне, для различения типов сообщений.
✓
✓
✓
✓
✓
✓
✓
Равносилен установке точки останова (breakpoint) в отладчике. debugger;Останавливает выполнение Javascript на текущей строке. Не считая остановки, никак не отражается на исполняемой програмке.
(оператор)
✓
✓
✓
✓
✓
✓
✓
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)
• … + much more – Firefox Developer Tools Episode 31 — console stack traces, styled console logs в Fx31.
• FireBug* Console API — описаны тонкости реализации, замеченные в тестах браузеров 2013 г;
• API консоли Javascript
(Корень описания — британский вариант, но до него нужно довести до свойства разметку таблицы на Гитхабе). UPD: для того, чтоб каждый мог доводить до совершенства это описание, перевести его на иной язык, внести обновления по мере развития браузеров, код выложен на Гитхаб и заложены базы мультиязычности и способности дописывания в эту табличку собственного спойлера (спойлеры в статье, естественно, привязаны к веб-сайту публикации). habrahabr.ru
