Differenza tra console.log () e console.debug ()?

144

Google non è stato utile per me, poiché la ricerca di "console.debug" fa apparire solo un mucchio di pagine che contengono le parole "console" e "debug".

Mi chiedo quale sia la differenza tra console.log()e console.debug(). C'è un modo per usare un sacco di console.debug()istruzioni e poi semplicemente premere un interruttore per disattivare facilmente tutte le istruzioni di debug dall'invio alla console (come dopo aver avviato un sito)?

— CaptSaltyJack
fonte

Ecco come disattivare le uscite console.log stackoverflow.com/questions/1215392/...

— frazras

Puoi mettere i colori. console.log ('% c Sample Text', 'color: green;'); Oppure aggiungi qualche VAR nel testo usando: console.log (`Sample $ {variabile}`, 'color: green;');

— Gilberto B. Terra Jr.

74

Per almeno le console IE, Firefox e Chrome, .debug () è solo un alias per .log () aggiunto per una migliore compatibilità

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

— Pete TNT
fonte

55

In Chrome debug()appare in blu e log()in nero

— Simon_Weaver

38

Un serio miglioramento rispetto a log ().

— Vael Victus,

32

Da developer.mozilla.org/en-US/docs/Web/API/console : console.debug () - Nota: a partire da Chromium 58 questo metodo appare solo nelle console del browser Chromium quando è selezionato il livello "Verbose".

— cilf,

Utilizzo del debug in Chrome: la chiamata al debug non è consentita

— Masoud Bimar

103

Tecnicamente console.log console.debuge console.infosono identici Tuttavia il modo in cui visualizzano i dati è leggermente diverso

console.log Testo di colore nero senza icona

console.info Testo di colore blu con icona

console.debug Testo in puro colore nero

console.warn Testo di colore giallo con icona

console.error Testo di colore rosso con icona

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);

— Prabhakar Undurthi
fonte

In google chrome i inforegistri a livello di browser sono semplicemente mostrati con un'icona (come nell'istantanea) ma il testo ( console.infotesto nel tuo post) è di colore nero e il colore di sfondo della riga è bianco. Forse la tua istantanea per il browser Firefox.

— RBT

3

Grazie per la risposta, molto chiaro con lo screenshot. Devo chiedere però, perché la concatenazione di stringhe? Perché non solo console.log("Console.log");invece di console.log("Console.log" + " " + playerOne);? Che cosa " " + playerOnefa?

— hofnarwillie,

Nella mia console, ottengo lo stesso display con

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

— kotchwane il

36

Sono quasi identici: l'unica differenza è che i messaggi di debug sono nascosti per impostazione predefinita nelle ultime versioni di Chrome ( Verboseper visualizzare i messaggi di debug è necessario impostare il livello di registro su nella barra superiore di Devtools mentre in console; i messaggi di registro sono visibili per impostazione predefinita).

— user2486570
fonte

2

Ciao, questo sembra vero, ma non riesco a trovare alcuna informazione su questo comportamento. I documenti di Chrome non lo menzionano ad oggi.

— Oligofren,

3

Ora ho finalmente capito "imposta il livello di registro su Verbose in cima alla console". Intendi in Dev Tools c'è la console in fondo. Nella parte superiore di questa sezione, insieme a Filter e al selettore di frame, è presente anche un menu a discesa dettagliato per i log (preimpostato su "Info")

— oligofren,

1

Questa è la risposta più pertinente. Tutti menzionano i colori ma questo è l'IMO più importante.

— DurkoMatko,

15

console.info, i console.debugmetodi sono identici a console.log.

console.log Dichiarazione di stampa
console.info Testo di colore nero con icona "i" in colore blu
console.debug Testo di colore blu

Documentazione:

— Venkat
fonte

Console.info stampa il colore blu, console.warn stampa il colore giallo e console.error stampa il colore rosso

— shivgre

Ho testato in Chrome 52.0.2743.82 Console.Info stampa in colore nero con icona blu, Console.warn stampe in colore nero con icona gialla console.error stampe in colore rosso con icona rossa

— Venkat

per favore modifica la tua risposta di conseguenza in modo che io possa votare o rimuovere il downvote, hai notato l'icona "i" di colore blu prima del testo stampato mentre

— usavo console.info

2

Se si desidera disabilitare la registrazione al termine di un prodotto, è possibile ignorare la console.debug()funzione o crearne un'altra personalizzata.

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

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

Foo▸ {età: 41, nome: "Jhon Doe"}

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

Nessuna uscita

Tuttavia, non ho pensato a un modo per colorare anche le uscite.

— Espen MS
fonte

1

Dalla documentazione dei browser, I log, debuge anche infoi metodi sono identici nella realizzazione saggio, ma varia in colore e l'icona

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

— Venkat
fonte

1

Questo dovrebbe essere un commento o aggiungere ulteriori spiegazioni con una risposta su come entrambi sono identici o nessuna differenza per capire OP e gli altri

— Grazie