Hvordan vise data som en tabell i nettleserkonsollen

Konsoll er et verktøy innebygd i nettleseren som registrerer feil som oppstår på nettsider. Hvis det er noen feil - for eksempel ødelagte koblinger, ufullstendige JavaScript- funksjoner eller ukjente CSS-egenskaper - vil nettleseren vise feilmeldinger i konsollen.

Du kan også samhandle med konsollen gjennom shell og Console API, som er nyttig for å teste visse funksjoner og utdata. Her vil artikkelen vise deg et nyttig tips for bruk av Console API.

Få tilgang til konsollen i nettleseren

I Chrome kan du velge Vis > Utvikler > JavaScript-konsoll for å vise konsollen. I tillegg kan du også bruke hurtigtasten: Cmd+ Option+ Jpå OS X og Ctrl+ Shift+ Jpå Windows.

Nedenfor er en feilfri Chrome-konsoll.

Herfra kan du begynne å bruke kommandoene gitt i Console API.

Samhandle med konsoll

Du kan samhandle med nettleserens konsoll gjennom selve konsollen og ved å legge til JavaScript. Her ber vi for eksempel konsollen om å gi resultatet "God morgen!" ved å skrive kommandoen console.log() direkte i konsollen:

Som nevnt kan du også bruke console.log(). Console.log() kan brukes til å teste en betinget JavaScript-setning. Du kan se tydeligere når resultatet returnerer sant eller usant (true eller usant) ved hjelp av console.log().

Her er et eksempel:

var a = 1;

if(a == 1) {

console.log('true');

} else {

console.log('false');

}

Koden ovenfor vil returnere true, fordi en variabel inneholder tallet 1 . I konsollen vil du se nettleseren skrive ut teksten med innholdet "true".

Utdata i tabellform

Noen ganger må du behandle en rekke data eller en liste over objekter, som vist nedenfor:

var data = [

{ name: "Andi", age: "21", city: "Tuban" },

{ name: "Ani", age: "25", city: "Trenggalek" },

{ name: "Adi", age: "30", city: "Kediri" }

];

console.table(data);

Disse dataene vil være vanskelige å lese når vi bruker console.log()-metoden. console.log()- metoden vil vise matrisen i en sammenleggbar trevisning, som vist nedenfor.

Når du må forholde deg til en slik Array, er bruk av console.table() en bedre måte å sende ut data på. Denne metoden viser dataene i et tabellformat. Ved å ta de samme dataene som ovenfor, vil resultatet se ut som følger:

Nettleserkonsollen hjelper nettutviklere med å håndtere feil på nettsteder. Brukere kan også bruke den til å undersøke datautdata, som med console.log()-metoden. Når du har en matrise med data, er console.table()- kommandoen mer nyttig, fordi den viser matrisen i et lettlest tabellformat. Vær oppmerksom på at console.table() bare gjelder i Webkit-baserte nettlesere som Chrome, Safari og den nyeste versjonen av Opera.

Håper du lykkes.