JavaScript: Cum se imprimă un mesaj în consola de erori? (Programare, Javascript, Depanare)

Mark Harrison a intrebat.

Cum pot imprima un mesaj în consola de erori, de preferință incluzând o variabilă?

De exemplu, ceva de genul:

print('x=%d', x);

Comentarii

  • Despre ce consolă vorbiți. Consola browserului sau consola specifică cadrului JavaScript? –  > Por Eric Schoonover.
  • Post conex – Chrome: console.log, console.debug nu funcționează –  > Por RBT.
18 răspunsuri
Dan

Instalați Firebug și apoi poți folosi console.log(...) și console.debug(...), , etc. (vezi documentația pentru mai multe informații).

Comentarii

  • @Dan: Inspectorul web WebKit Web Inspector acceptă, de asemenea, API-ul de consolă FireBug –  > Por olliej.
  • 164

  • de ce este acesta răspunsul acceptat? el nu a întrebat cum să scrie în consola Firebug, a întrebat cum să scrie în consola de erori. nu sunt un nesimțit sau ceva de genul ăsta, doar subliniez asta. –  > Por matt lohkamp.
  • 127

  • +1. Și, în beneficiul oricărei persoane care ajunge acum la această întrebare, merită subliniat faptul că, de când s-a răspuns la întrebare, toate browserele au implementat acum obiectul consolă, deci console.log() etc. ar trebui să funcționeze în toate browserele, inclusiv în IE. Cu toate acestea, în toate cazurile, trebuie să aveți fereastra de depanare deschisă în acel moment, altfel apelurile către console vor genera erori. –  > Por Spudley.
  • @andrewjackson după cum am menționat mai devreme, console.log funcționează bine în toate browserele moderne, inclusiv IE. Codul dvs. este în continuare perfect valabil și util dacă intenționați să sprijiniți browserele mai vechi (și dacă lucrați la un site web public, cu siguranță ar trebui să o faceți!), însă critica mea se referă doar la faptul că comentariul dvs. este înșelător / nu este corect. –  > Por BrainSlugs83.
  • console.debug(), pe de altă parte, nu există în în IE. Putem rezolva acest lucru cu: if (!console.debug){ console.debug = function(args){ console.log(args); } } –  > Por Rovanion.
Nicholas
console.error(message); // Outputs an error message to the Web Console
console.log(message); // Outputs a message to the Web Console
console.warn(message); // Outputs a warning message to the Web Console
console.info(message); // Outputs an informational message to the Web Console. In some browsers it shows a small "i" in front of the message.

De asemenea, puteți adăuga CSS:

console.log('%c My message here', "background: blue; color: white; padding-left:10px;");

Mai multe informații pot fi găsite aici: https://developer.mozilla.org/en-US/docs/Web/API/console

Comentarii

  • Documentație pentru Chrome: developers.google.com/chrome-developer-tools/docs/console –  > Por mrzmyr.
  • Acesta este răspunsul corect. Cuvântul „eroare” nici măcar nu este menționat în răspunsul selectat, deși se află în titlul întrebării. –  > Por Ivan Durst.
  • Partea suplimentară despre adăugarea de CSS este destul de amuzantă. +1! –  > Por sudo make install.
  • @O.R.Mapper Ce nu funcționează acolo? CSS-ul, presupun? –  > Por Nicholas.
  • În momentul în care vă dați seama că, în toți acești ani de utilizare a console.log ești capabil să folosești css în interiorul consolei 😐 – –  > Por Red.
Ivo Danihelka

Excepțiile sunt înregistrate în consola JavaScript. Puteți utiliza acest lucru dacă doriți să păstrați Firebug dezactivat.

function log(msg) {
    setTimeout(function() {
        throw new Error(msg);
    }, 0);
}

Utilizare:

log('Hello World');
log('another message');

Comentarii

  • În unele browsere, dacă aveți depanarea activată, acest lucru va arunca mesaje pop-up. –  > Por BrainSlugs83.
  • Ați putea explica, vă rog, de ce throw trebuie să fie înfășurat într-un setTimeout? –  > Por Antony.
  • Pentru motivele pentru care este necesar setTimeout, consultați răspunsul meu. Practic, este pentru a arunca eroarea într-un nou fir. –  > Por dlaliberte.
Ian Oxley

O modalitate bună de a face acest lucru, care funcționează între browsere, este prezentată în Depanarea JavaScript: Aruncă-ți alertele!.

Comentarii

  • throw() este o sugestie excelentă – acesta ar trebui să fie răspunsul ales. –  > Por matt lohkamp.
  • 17

  • De acord, aceasta este o abordare cross-browser. Dar… Nu este aruncarea unei excepții fundamental diferită de înregistrarea mesajelor? –  > Por Robin Maben.
  • Pe de altă parte, aruncarea unei excepții va opri execuția „firului” curent (așa cum a menționat Yuval A), și o va relua în catch, dacă există unul. Mă îndoiesc că acest lucru este ceea ce se dorește. –  > Por dlaliberte.
  • throw() cu siguranță nu este modul de a face acest lucru. veți avea probleme mai devreme sau mai târziu. pentru mine a fost mai devreme 🙁 –  > Por Hugo Mota.
  • @Ian_Oxley: a fost oprit la un moment dat, acum este din nou în funcțiune, dar postarea codului chiar aici este încă mai bună și recomandată de cele mai bune practici stackoverflow. –  > Por scrat.squirrel.
dlaliberte

Iată o soluție la întrebarea literală despre cum să tipăriți un mesaj în consola de erori a browserului, nu în consola debuggerului. (Ar putea exista motive întemeiate pentru a ocoli debuggerul).

Așa cum am remarcat în comentariile despre sugestia de a arunca o eroare pentru a obține un mesaj în consola de erori, o problemă este că acest lucru va întrerupe firul de execuție. Dacă nu doriți să întrerupeți firul de execuție, puteți arunca eroarea într-un fir separat, unul creat folosind setTimeout. De aici și soluția mea (care se dovedește a fi o elaborare a celei a lui Ivo Danihelka):

var startTime = (new Date()).getTime();
function logError(msg)
{
  var milliseconds = (new Date()).getTime() - startTime;
  window.setTimeout(function () {
    throw( new Error(milliseconds + ': ' + msg, "") );
  });
}
logError('testing');

Am inclus timpul în milisecunde de la ora de începere, deoarece timeout-ul ar putea distorsiona ordinea în care te-ai putea aștepta să vezi mesajele.

Al doilea argument al metodei Error este pentru numele fișierului, care este un șir gol aici pentru a preveni afișarea numelui de fișier și a numărului de linie inutile. Este posibil să se obțină funcția apelantului, dar nu într-un mod simplu și independent de browser.

Ar fi frumos dacă am putea afișa mesajul cu o pictogramă de avertizare sau de mesaj în loc de pictograma de eroare, dar nu găsesc o modalitate de a face acest lucru.

O altă problemă legată de utilizarea funcției throw este faptul că ar putea fi prinsă și aruncată de un try-catch care o include, iar dacă se pune throw într-un fir separat se evită și acest obstacol. Cu toate acestea, există încă o altă modalitate prin care eroarea ar putea fi prinsă, și anume dacă gestionarul window.onerror este înlocuit cu unul care face ceva diferit. Nu vă pot ajuta în acest caz.

Lukas

Dacă folosiți Safari, , puteți scrie

console.log("your message here");

și apare chiar pe consola browserului.

Comentarii

  • Toate browserele moderne acceptă console.log(). –  > Por JJJJ.
  • Toate browserele moderne suportă ACUM console.log(). Nu era adevărat până de curând. –  > Por Bryce.
Yster

Pentru a răspunde efectiv la întrebare:

console.error('An error occurred!');
console.error('An error occurred! ', 'My variable = ', myVar);
console.error('An error occurred! ' + 'My variable = ' + myVar);

În loc de error, puteți folosi și info, log sau warn.

Comentarii

  • Răspunsul dvs. pare cel mai bun, dar Pagina MDN a Mozilla spune console.error(..) este o caracteristică non-standard și nu ar trebui să fie utilizată în producție. Ce părere aveți despre acest lucru? Aveți vreo sugestie pentru un programator începător care utilizează console.error vs console.log? –  > Por modulitos.
  • Acest lucru este interesant. Nu ar trebui să folosim acest lucru atunci. Mulțumesc pentru informații, Lucas. –  > Por Yster.
  • MDN consideră console.log(...) „non-standard”, de asemenea. În această privință, console.error este la fel de stabil ca console.log. –  > Por Mike Rapadas.
  • @Lucas Cui îi pasă dacă este standard? Cine va folosi logarea în consolă pentru producție? –  > Por Andrew.
  • Console.error funcționează acum în toate browserele importante. Chiar și IE8. Consultați developer.mozilla.org/en-US/docs/Web/API/Console/error –  > Por Red.
Devon

Dacă utilizați Firebug și aveți nevoie de suport pentru IE, Safari sau Opera, Firebug Lite adaugă suportul console.log() pentru aceste browsere.

Comentarii

  • Wow… Firebug Lite este minunat –  > Por Dexter.
olliej

The WebKit Web Inspector suportă și Firebug’s (doar o adăugare minoră la răspunsul lui Dan).

Comentarii

  • Foarte frumos că WebKit îl suportă. Deci este destul de larg susținut atunci. Minunat! –  > Por Albus Dumbledore.
Yuval A.

O notă despre „throw()” menționat mai sus. Se pare că oprește complet execuția paginii (am verificat în IE8) , așa că nu este foarte utilă pentru înregistrarea „proceselor în desfășurare” (cum ar fi urmărirea unei anumite variabile…)

Sugestia mea este poate să se adauge un textarea undeva în document și să modificați (sau să adăugați la) elementul său valoarea (ceea ce ar schimba textul) pentru a înregistra informații ori de câte ori este necesar…

Comentarii

  • Bănuiesc că e din cauză că nu ai răspuns la întrebarea lui OP. Pentru a imprima în consola JS, trebuie să utilizați o metodă încorporată, cum ar fi console.log(), , throw(), , etc. În plus, nu este nimic în neregulă cu comportamentul lui throw() așa cum păreți să insinuați – faptul că oprește execuția este intenționat și documentat (developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…), și este în concordanță cu modul în care sunt aruncate/capturate excepțiile în alte limbaje de programare. (Dacă doriți să înregistrați conținutul unei variabile fără a opri execuția, asta este ceea ce console.log() este pentru). –  > Por Sean the Bean.
  • @SeantheBean, inițial a existat o discuție despre faptul că IE nu suporta console.log – așa că oamenii dădeau alternative. Despre throw() oprirea execuției, desigur, este intenționat, nimeni nu a spus că nu este. De aceea este de obicei nu o modalitate bună de a înregistra informații de depanare în timp de execuție, ceea ce a vrut OP… –  > Por Yuval A..
Chris S

Ca întotdeauna, Internet Explorer este marele elefant în patine cu rotile care te împiedică să folosești pur și simplu console.log().

Jurnalul jQuery poate fi adaptat destul de ușor, dar este o pacoste să trebuiască să-l adăugați peste tot. O soluție, dacă folosiți jQuery, este să îl puneți în fișierul jQuery la sfârșit, minificat mai întâi:

function log()
{
    if (arguments.length > 0)
    {
        // Join for graceful degregation
        var args = (arguments.length > 1) ? Array.prototype.join.call(arguments, " ") : arguments[0];

        // This is the standard; Firebug and newer WebKit browsers support this.
        try {
            console.log(args);
            return true;
        } catch(e) {
            // Newer Opera browsers support posting erros to their consoles.
            try {
                opera.postError(args);
                return true;
            } 
            catch(e) 
            {
            }
        }

        // Catch all; a good old alert box.
        alert(args);
        return false;
    }
}

Comentarii

  • Acum este acceptat ca extensie a jQuery, dar nu ar fi mai eficient să verificați dacă obiectele ‘console’ și ‘opera’ există înainte de a prinde excepția? –  > Por Marinarul Danubian.
  • @lechlukasz Cred că puteți economisi cheltuielile generale ale extensiei și puteți folosi doar console.log plus această verificare IE: stackoverflow.com/questions/1215392/… –  > Por Chris S.
devSouth555

Vizitați https://developer.chrome.com/devtools/docs/console-api pentru o referință completă a api de consolă

    console.error(object[Obj,....])

În acest caz, obiectul ar fi șirul de erori

Parth Raval

To Print Error:- console.error('x=%d', x);

D.K
console.log("your message here");

funcționează pentru mine… caut acest lucru… am folosit Firefox. aici este scriptul meu.

 $('document').ready(function() {
console.log('all images are loaded');
});

funcționează în Firefox și Chrome.

Kenneth John Falbous

Cel mai simplu mod de a face acest lucru este:

console.warn("Text to print on console");

Aniket Kulkarni

Pentru a răspunde la întrebarea dvs. puteți utiliza caracteristicile ES6,

var var=10;
console.log(`var=${var}`);

mmm

Acest lucru nu imprimă în consolă, dar vă va deschide un Popup de alertă cu mesajul dvs. care ar putea fi util pentru o anumită depanare:

Doar faceți:

alert("message");

Comentarii

  • Asta nu are nimic în comun cu ceea ce a cerut OP –  > Por nedefinit.
jkordas

Cu sintaxa es6 puteți folosi:

console.log(`x = ${x}`);