Різниця між console.log () та console.debug ()?

143

Google не допомагає мені, оскільки пошук "console.debug" просто відкриває купу сторінок, на яких є слова "console" та "debug".

Мені цікаво, в чому різниця між console.log()і console.debug(). Чи є спосіб використати купу console.debug()висловлювань, а потім просто переключити перемикач, щоб легко відключити всі заяви про налагодження від надсилання на консоль (наприклад, після запуску сайту)?

— CaptSaltyJack
джерело

Ось як відключити console.log виходи stackoverflow.com/questions/1215392 / ...

— frazras

Можна нанести кольори. console.log ('% c зразок тексту', 'color: green;'); Або додайте у текст трохи VAR, використовуючи: console.log (`Sample $ {змінний}`, 'color: green;');

— Гілберто Б. Тера-молодший

74

Щонайменше для консолей IE, Firefox та Chrome, .debug () - це лише псевдонім для .log (), доданого для покращення сумісності

https://developer.mozilla.org/en-US/docs/Web/API/console

https://developers.google.com/chrome-developer-tools/docs/console-api#consoledebugobject_object

https://msdn.microsoft.com/en-us/library/ie/hh772183(v=vs.85).aspx

— Піт ТНТ
джерело

55

У Chrome debug()з'являється синій і log()чорний кольори

— Simon_Weaver

38

Серйозне поліпшення щодо журналу ().

— Vael Victus

32

Від developer.mozilla.org/en-US/docs/Web/API/console : console.debug () - Примітка. Починаючи з Chromium 58, цей метод з’являється лише на консолях браузера Chromium, коли вибрано рівень «Вербоза».

— cilf

Використання налагодження в Chrome: виклик налагодження

— заборонено

103

Технічно console.log console.debugі console.infoідентично. Однак спосіб відображення даних мало відрізняється

console.log Текст чорного кольору без значка

console.info Синій колір тексту з піктограмою

console.debug Чисто чорний кольоровий текст

console.warn Текст жовтого кольору з піктограмою

console.error Текст червоного кольору з піктограмою

var playerOne = 120;
var playerTwo = 130;
var playerThree = 140;
var playerFour = 150;
var playerFive = 160;

console.log("Console.log" + " " +  playerOne);
console.debug("Console.debug" + " " +playerTwo);
console.warn("Console.warn" + " " + playerThree);
console.info("Console.info" + " " + playerFour);
console.error("Console.error" + " " + playerFive);

— Прабхакар Ундурті
джерело

У веб-переглядачі google chrome infoжурнали просто відображаються піктограмою (такою ж, як на знімку), але текстом (console.info текст у вашій публікації) має чорний колір, а колір фону рядка - білий. Можливо, ваш знімок для браузера firefox.

— RBT

3

Дякую за відповідь, дуже чітко зі скріншотом. Потрібно запитати, чому ж об'єднання рядків? Чому б не просто console.log("Console.log");замість console.log("Console.log" + " " + playerOne);? Що робить " " + playerOne?

— hofnarwillie

У моїй консолі я отримую той самий дисплей з

console.log("Console.log"); console.debug("Console.debug"); console.warn("Console.warn");  console.info("Console.info");  console.error("Console.error");

— kotchwane

36

Вони майже однакові - лише відмінність полягає в тому, що повідомлення про налагодження за замовчуванням приховано в останніх версіях Chrome (вам потрібно встановити рівень журналу Verboseна верхній панелі Devtools, перебуваючи в консолі, щоб побачити повідомлення про налагодження; повідомлення журналу видно за замовчуванням).

— user2486570
джерело

2

Привіт, це здається правдою, але я не можу знайти жодної інформації про цю поведінку. Документи Chrome не згадують про це сьогодні.

— олігофрен

3

Тепер я нарешті зрозумів "встановити рівень журналу на Verbose на вершині консолі". Ви маєте на увазі, що в Dev Tools знаходяться консолі внизу. У верхній частині цього розділу, поряд з фільтром та селектором кадрів, також є багатослівний спад для журналів (заздалегідь "Інфо")

— oligofren

1

Це найбільш відповідна відповідь. Усі згадують кольори, але це важливіше IMO.

— ДуркоМатко

15

console.info, console.debugметоди ідентичні console.log.

console.log Друкована заява
console.info Текст чорного кольору із значком "i" у синьому кольорі
console.debug Текст синього кольору

Документація:

— Венкат
джерело

Console.info друкує синій колір, console.warn друкує жовтий колір, а console.error друкує червоний колір

— shivgre

Я перевірив на консолі Chrome 52.0.2743.82 консоль.Інфо друкується чорним кольором із синім значком, Console.warn друкує чорним кольором із жовтим значком console.error друкує червоним кольором із червоним значком

— Venkat

будь ласка, відредагуйте відповідь відповідно, щоб я міг підняти або видалити нижчу заявку, чи помітили ви синій кольоровий значок "i" перед надрукованим текстом під час використання console.info ()

— shivgre

2

Якщо ви хочете, щоб можливість відключити ведення журналу після закінчення продукту, ви можете змінити console.debug()функцію або зробити інший на замовлення.

console.debug = function() {
    if(!console.debugging) return;
    console.log.apply(this, arguments);
};

console.debugging = true;
console.debug('Foo', {age:41, name:'Jhon Doe'});

Foo▸ {вік: 41, назва: "Jhon Doe"}

console.debugging = false;
console.debug('Foo', {age:26, name:'Jane Doe'});

Виходу немає

Однак я ще не придумав спосіб розфарбувати результати.

— Еспен MS
джерело

1

З «Документація браузерів», «The» log, debugа також infoметоди ідентичні у здійсненні, але відрізняються кольором та значком

https://jsfiddle.net/yp4z76gg/1/

— Венкат
джерело

1

Це має бути коментар або додати більше пояснень з відповіддю на те, як обидва однакові або немає різниці для розуміння ОП та інших.

— Дякую