JSON — dataens form
Les og bruk JSON i arbeidsområdet — dataens vanligste format.
Et API svarer i tekst, og formatet heter JSON. Det ser ut som JavaScript-objekter, men det er strengere regler — og i denne øvelsen leser du JSON selv, i arbeidsområdet nederst på siden.
Reglene til JSON
JSON er ikke JavaScript — det er et tekstformat som *ligner* på JavaScript-objekter. Reglene er få og strenge:
- nøkler og tekstverdier skal stå i dobbelt-anførselstegn: "navn" — alltid
- ingen kommentarer, og ingen komma etter siste verdi
- verdiene kan være tall, true/false, null, strenger, arrayer og objekter — og arrayer og objekter kan ligge i hverandre så dypt du vil
Parse og les
JSON.parse gjør teksten om til data du kan jobbe med. Merk deg anførselstegnene rundt *hele* strengen i første linje — JSON er tekst, husk. Inni objektet som kommer ut, er alt ekte JavaScript:
const json = '{"navn":"Amina","alder":24,"by":"Oslo","fag":["js","python"]}'; const elev = JSON.parse(json); console.log(elev.navn); // "Amina"console.log(elev.fag[0]); // "js"console.log(elev.fag.length); // 2Oppgaven
Øvelsen ligger i arbeidsområdet nederst på siden. Der venter en JSON-streng i script.js — jobben din er å parse den og lese ut dataene:
- Parse JSON-strengen som ligger klar i starteren, med
JSON.parse. - Fang resultatet i en variabel med
const. - Les minst ett felt fra objektet — for eksempel
.navn. - Skriv ut med
console.log(…)og se resultatet i konsollen. - Les minst to felter — for eksempel
.navnog.alder.
Obs
Anførselstegn eller ikke?
I et JS-objekt du skriver selv, kan nøkler stå uten anførselstegn: { navn: "Amina" }. I en JSON-streng må de ha det: '{"navn":"Amina"}'. Ser det likt ut? Det er der forvirringen bor — strengen er tekst, objektet er data.
Du kan nå
- gjenta reglene til JSON: anførselstegn på nøkler, ingen kommentarer, nestede strukturer
- parse en JSON-streng med JSON.parse og lese felter fra objektet
- lese ut verdier fra en array som bor inni objektet
Arbeidsområdet
JavaScriptLeksjonen over handlet om JSON — her får du strengen servert. Parse den, fang objektet i en variabel, og les feltene ut i konsollen. Trykk «Kjør» når du vil se utskriften.
Tips: Ctrl + Enter kjører koden, Ctrl + Shift + Enter sjekker løsningen (Cmd på Mac).
Framdriften din
0 av 5
- Bruker JSON.parse på strengen
- Fanger resultatet i en variabel
- Leser minst ett felt fra objektet
- Skriver ut med console.log
- Leser minst to felter
Konsoll
Kjør koden for å se output her.