In dit artikel gaan we op een makkelijke manier uitleggen wat JSON is. Ook krijg je een duidelijk JSON voorbeeld te zien, waarin de syntax van JSON goed zichtbaar is. Tot slot geven we tips over hoe je zelf met JSON aan de slag kan gaan. Lees lekker verder!
JSON uitleg
JSON is de afkorting van “JavaScript Object Notation”. Het is momenteel het meest populaire en gebruikte standaard formaat om data/gegevens/informatie uit te wisselen en op te slaan.
JSON wordt vooral veel gebruikt om data van een server te versturen naar een webpagina. De webpagina kan het JSON formaat makkelijk uitlezen, omdat het aan bepaalde standaarden voldoet.
Een webpagina kan vragen om data aan de server en de server stuurt de opgevraagde data in JSON formaat terug. Zo kan een webpagina bijvoorbeeld de huidige temperatuur ophalen in Parijs.
Hier komt een API (Application Programming Interface) bij kijken. In “Wat is een API?” lees je er meer over.
De syntax van JSON is makkelijk te begrijpen. In het volgende hoofdstuk zal je zien dat het niet lastig is.
JSON voorbeeld
Laten we eens gaan kijken naar een simpel voorbeeld van een JSON formaat. In het vorige hoofdstuk hadden we het al over het ophalen van de temperatuur in Parijs. Dit is een voorbeeld van een JSON formaat, waarmee je de temperatuur van Parijs kan ophalen:
{
"id": 1,
"stad": "Parijs",
"temperatuur": 21,
"wijk": [
"Les Halles",
"Gaillon",
"Notre-Dame"
],
"inwoners": 2141000
}
In “Wat is een API” staat dit voorbeeld ook. Hier gaan we iets dieper in op het JSON formaat. Je ziet de temperatuur van Parijs staan. Als je dit JSON formaat ontleed in code, zou je de temperatuur kunnen gebruiken op je webpagina.
Ook zou je andere data kunnen gebruiken, zoals het aantal inwoners. Stel dat de server altijd de data up-to-date houdt, dan heb je altijd de beste data op je webpagina.
Een JSON formaat bestaat uit twee belangrijke onderdelen, namelijk:
- Een object: Dit een verzameling van namen en de bijbehorende waardes. De namen/waardes staan tussen accolades (Curly brackets)
{}. Een voorbeeld van een naam/waarde paar in het bovenstaande JSON formaat is:"stad": "Parijs". Om onderscheid te maken tussen de verschillen naam/waarde paren gebruik je een komma,. - Een array: Dit is een lijst met waardes. In het bovenstaande JSON voorbeeld zie je bij
"wijk"een lijst met waardes staan. De waardes bestaan uit namen van wijken in Parijs. De waardes in een JSON array staan tussen haakjes (Square brackets)[]. Om onderscheid te maken, gebruik je in een array ook komma’s tussen de waardes.
De namen in een JSON formaat staan allemaal tussen dubbele quotes "". Dat zie je in het bovenstaande JSON voorbeeld bij onder andere "id", "stad" en "temperatuur".
Dit zijn de mogelijkheden voor waardes in een JSON formaat:
- String: Waarde tussen dubbele quotes
"", zoals"Parijs". - Getal: Hele getallen zijn toegestaan en getallen achter de komma ook. In JSON gebruik je geen komma, maar een punt, zoals
21.5. true,falseennull.
Zelf met JSON aan de slag
Als het goed is weet je nu beter wat JSON is. Je hebt een JSON voorbeeld gezien en de syntax van JSON is duidelijker geworden.
Wil je nog meer over JSON weten en/of er zelf ook mee aan de slag gaan? Je kan bijvoorbeeld ook leren om met een API te werken of zelf een API te ontwikkelen.
Op Pluralsight kan je nog meer leren over JSON en je leert ook hoe je het gebruikt in verschillende programmeertalen. Op het platform heb je ook de mogelijkheid om te leren werken met een API en hoe je er zelf één maakt.
Sowieso is Pluralsight een heel gaaf platform om onder andere programmeertalen, frameworks en de allernieuwste technologieën te leren. Je kan Pluralsight zelfs 10 dagen helemaal gratis uitproberen.
In “Pluralsight review en ervaringen” lees je meer over dit gave en leerzame platform.
Als je nog geen verstand hebt van programmeren, kan het best een stap zijn om in code gelijk te werken met een JSON formaat. Heb je interesse in programmeren, maar heb je er nog geen ervaring mee? Dan is het e-book “Snelcursus Leren Programmeren” een echte aanrader om de basis van het programmeren te leren.
Ga lekker aan de slag en doe veel kennis op.
Heb je nog vragen en/of opmerkingen? Laat dan hieronder een reactie achter of neem contact op.
wat een leuk geschreven en toegangkelijk artikel!
Dankje Chris!
Ik ben het met Chris eens! Dank je wel
Geen dank Bastiaan!
De namen/waardes staan tussen accolades (Curly brackets) {}. Een voorbeeld van een naam/waarde paar in het bovenstaande JSON formaat is: “stad”: “Parijs”.
Je bedoelt dus (?) dat de namen/waardes tussen aanhalingstekens staan.
Hoi Gerard,
De namen/waardes staan tussen accolades in een object en je gebruikt aanhalingstekens voor de namen en string waardes, dus namen en string waardes staan inderdaad ook tussen aanhalingstekens.
Gr. Bas
Dus de curly brackets staan helemaal bovenin en onderin de file.
En hierin wordt dus de JSON file “temp in parijs” aangemaakt, waarvan de namen en waardes in die volgorde tussen de “” staan, gescheiden door komma’s.
Wat als je de wijken van deze file over wilt laten aan de bevrager van de data? Waar verwijs je dan naar en op welke manier?
En is de bestandsnaam dan tip.json, als je ernaar verwijst verderop in je pagina?
Hoi Pim,
Tussen de accolades (Curly brackets) wordt geen bestand aangemaakt, het gehele JSON voorbeeld kan een JSON bestand zijn.
Bedoel je hoe iemand de data kan ophalen, zoals een wijk?
Je laatste vraag begrijp ik niet helemaal.
Gr. Bas
Hoi Bas, dank je voor je antwoord. Ik begrijp blijkbaar niet goed hoe dit werkt. Bedoel je met het hele json bestand dat er ook buiten de {} code kan staan die hoort bij het json, en dat binnen de {} 1 entiteit wordt gespecificeerd?
Ik neem ook aan dat je iedere wijk apart zou kunnen bevragen, als je bv alleen de 2e/middelste zou willen weten.
Ik denk dat ik het heb hoe een applicatie een json benaderd, niet per se over hoe dat de file gebouwd is.
Ik bedoel dan dat de accolades onderdeel zijn van het JSON bestand. JSON moet voldoen aan bepaalde standaarden, zodat computers het makkelijk kunnen ontleden en genereren. Dit maakt uitwisseling van data makkelijker.
In code is het mogelijk bij het ontleden om aparte wijken op te vragen. Er is veel mogelijk bij het ontleden van JSON in code.
Een aanrader is om json.org door te nemen: https://www.json.org/
Dank je Bas 👍🏻