Scroll Top
Via Antonio Amato, 20/22 84131 Salerno (SA)

Javascript Tips and Tricks – Console

Console javascript

(articolo redatto da Gaetano De Pascale)

Ci sono due tipi di Javascript developer: quelli che usano il console.log come metodo di debug “veloce” e quelli che mentono! Ma conosciamo davvero tutti i modi per utilizzare la console?

Console.log è indubbiamente il metodo di  debug più utilizzato e forse potrebbe bastare conoscere questo, ma proviamo ad andare oltre ed evidenziare altre metodologie per utilizzare l’oggetto console.

1. console.table

Ci permette di stampare e visualizzare in console dati in forma tabellare:

function Person(firstName, lastName) {
    this.firstName = firstName;
    this.lastName = lastName;
  }
  const persons = [
    new Person("John", "Doe"),
    new Person("Mario", "Rossi"),
    new Person("Andrea", "Bianchi"),
    new Person("Jane", "Smith")
  ];
  console.table(persons);
Nexsoft blog | console.table

2. console.dir

Ci permette di stampare una lista di tutte le proprietà di un oggetto sotto forma di elemento espandibile.

console.dir(document.location);
Nexsoft blog | console.dir

3. console.group – console.groupEnd

Ci permette di raggruppare un insieme di log dandoci un titolo.

  console.group("Log in fase di loading ...");
  console.log('href:' + document.location.href);
  console.log('sto caricando la pagina iniziale');
  console.groupEnd();
Nexsoft blog | console.group

4. console.log

Anche lo stesso classico console.log può essere usato in maniere differente:

  const name = 'Paperino';
  console.log('log:', name);
  console.log('log:', { name });

console.log e nome della variabile da stampare ————> stampa il contenuto della variabile

console.log e variabile tra parentesi quadre ————> stampa il nome della variabile ed il suo valore

Nexsoft blog | console.group

5. console.debug – console.warn – console.info – console.error

Ci permettono di tracciare informazioni a diverso livello in modo da poterli filtrare tramite la console.

  console.debug('debug');
  console.warn('warn');
  console.info('info');
  console.error('error');
Nexsoft blog | console.debug

6. console.assert

Ci permette di scrivere un messaggio di errore quando l’assert non è verificato.

  const errorMsg = "the # is not even";
  for (let number = 2; number <= 5; number++) {
    console.log(`the # is ${number}`);
    console.assert(number % 2 === 0, "%o", { number, errorMsg });
  }
Nexsoft blog | console.assert

7. console.trace

Ci permette di scrivere un messaggio di errore quando l’assert non è verificato.

  console.trace();
Nexsoft blog | console.assert

Ci permette di stampare in console lo stack trace applicativo.

8. console.clear

Il metodo clear() è utilizzato per svuotare la console.

9. console.time – console.timeEnd

Ci permette di verificare il tempo di esecuzione di una porzione di codice.

console.time("Start long running code");
  const bigAarray = new Array(10000);
  for (let i = 0; i < bigAarray.length; i++) {
    bigAarray[i] = {
      id: i,
      name: 'Obj_' + i,
    };
  }
  console.timeEnd("Start long running code");
Nexsoft blog | console.time

Conclusioni

E tu? Li utilizzi questi comandi o ti basta il console.log? Conosci altri utilizzi dell’oggetto console?


Se anche tu vuoi occuparti di progetti di ricerca e sviluppo IT di ultima generazione
dai un’occhiata alle nostre opportunità di lavoro e conosciamoci subito!

Questo sito utilizza cookies propri e si riserva di utilizzare anche cookie di terze parti per garantire la funzionalità del sito e per tenere conto delle scelte di navigazione.
Per maggiori dettagli e sapere come negare il consenso a tutti o ad alcuni cookie è possibile consultare la Cookie Policy.

USO DEI COOKIE

Se abiliti i cookie nella tabella sottostante, ci autorizzi a memorizzare i tuoi comportamenti di utilizzo sul nostro sito web. Questo ci consente di migliorare il nostro sito web e di personalizzare le pubblicità. Se non abiliti i cookie, noi utilizzeremo solo cookies di sessione per migliorare la facilità di utilizzo.

Cookie tecnicinon richiedono il consenso, perciò vengono installati automaticamente a seguito dell’accesso al Sito.

Cookie di statisticaVengono utilizzati da terze parti, anche in forma disaggregata, per la gestione di statistiche

Cookie di social networkVengono utilizzati per la condivisione di contenuti sui social network.

Cookie di profilazione pubblicitariaVengono utilizzati per erogare pubblicità basata sugli interessi manifestati attraverso la navigazione in internet.

AltriCookie di terze parti da altri servizi di terze parti che non sono cookie di statistica, social media o pubblicitari.