De JSON is een lichtgewicht gegevensintegratieformaat dat voornamelijk wordt gebruikt voor het opslaan en transporteren van gegevens van de ene server of het andere systeem. Aan de andere kant slaat een kaart ook gegevens op en wordt het sleutelwaardeformaat gebruikt, waarbij de sleutel elk gegevenstype kan hebben. De ontwikkelaar kan specifieke gegevens ophalen door de bijbehorende sleutel te selecteren.
In dit artikel wordt het proces voor het converteren van JSON naar/van een kaart in JavaScript uitgelegd door de volgende secties te behandelen:
- Hoe JSON-gegevens naar een kaart in JavaScript converteren?
- Hoe JSON-gegevens van een kaart in JavaScript converteren?
- Hoe u de JSON API kunt ophalen en de gegevens ervan in een kaart kunt converteren
Hoe JSON-gegevens naar een kaart in JavaScript converteren?
Bij het converteren van JSON-gegevens naar een kaart blijft het sleutel-waardepaarformaat behouden als 'Kaart' en slaat ook gegevens op in de sleutelwaardevorm, net als JSON. De ontwikkelaar kan dus de oorspronkelijke volgorde van de sleutels behouden, wat niet gegarandeerd is bij JavaScript-objectconversie. Converteren “JSON” gegevens in 'Kaart' biedt meer flexibiliteit en stelt de ontwikkelaar in staat om ingebouwde Map-methoden te gebruiken om het navigeren door de gegevens gemakkelijker te maken.
Laten we het onderstaande codeblok bezoeken waar de hardgecodeerde JSON-gegevens zullen worden omgezet in een kaart:
< scripttype = 'tekst/javascript' >
const jsonFormaat = '{'author1':Jackson', 'author2':Reed', 'author3':Tasha', 'author4'Petterson'} ' ;
const kaartFormaat = nieuw Kaart ( Voorwerp . inzendingen ( JSON. ontleden ( jsonFormaat ) ) ) ;
troosten. loggen ( kaartFormaat ) ;
script >
De uitleg van de bovenstaande code luidt als volgt:
- Maak eerst een const type variabele met de naam 'jsonFormat' met gegevens in JSON-formaat, dat wil zeggen in het sleutelwaardeformaat.
- Maak vervolgens een nieuw exemplaar van de kaart met de naam “kaartformaat” . Om de JSON-gegevens te parseren, geeft u de “kaartformaat” binnen in de “JSON.parse()” methode.
- Geef vervolgens het resultaat dat door deze methode wordt geretourneerd door in de “Object.entries()” om een array van arrays te maken en elke binnenste array vertegenwoordigt de sleutel-waardeparen.
- Geef het eindresultaat of al deze methoden door, langs de juiste uitlijning binnen de 'Kaart' bouwer. Nu, het voorbeeld “kaartformaat” bevat de geconverteerde JSON-gegevens die via het consolevenster worden weergegeven met behulp van de “console.log()” methode.
Na het compileren van de bovenstaande code ziet het consolevenster er als volgt uit:
De uitvoer bevestigt dat de JSON-gegevens zijn omgezet in Map. Voor meer informatie en voorbeelden om JSON-gegevens naar een array of kaart te converteren, kunt u onze andere bezoeken artikel .
Hoe JSON-gegevens van een kaart in JavaScript converteren?
Het converteren van gegevens naar JSON-indeling verbetert de levenslange beschikbaarheid ervan en stelt u in staat deze gegevens overal via het netwerk te verzenden zonder gegevens te verliezen. Bovendien is het JSON-formaat gemakkelijk leesbaar voor mensen en kan het worden gebruikt in web-API of configuratiebestanden. In het onderstaande programma worden de kaartgegevens geconverteerd naar het JSON-formaat:
< scripttype = 'tekst/javascript' >const kaartFormaat = nieuw Kaart ( [
[ 'auteur1' , 'Jackson' ] ,
[ 'auteur2' , 'Riet' ] ,
[ 'auteur3' , 'Tasha' ] ,
[ 'auteur4' , 'Peterson' ] ,
] ) ;
const jsonFormat = JSON. stringeren ( Voorwerp . vanInzendingen ( kaartFormaat ) ) ;
troosten. loggen ( jsonFormat ) ;
script >
De uitleg van het bovenstaande codeblok luidt als volgt:
- Ten eerste de instantie met de naam “kaartformaat” is gemaakt voor de kaart die verschillende vermeldingen bevat.
- Vervolgens de “Object.fromEntries()” methode wordt gebruikt en de “kaartformaat” wordt eraan doorgegeven. Hierdoor worden de verstrekte kaartgegevens omgezet in een geneste array.
- Vervolgens wordt de geneste array doorgegeven aan de “JSON.stringify()” methode om de geneste array naar het JSON-formaat te converteren terwijl de uitlijning van het sleutel-waardepaar behouden blijft.
- Uiteindelijk worden de gegenereerde gegevens in JSON-formaat weergegeven via het consolevenster.
De uitvoer die wordt gegenereerd na het compileren van de bovenstaande code wordt hieronder weergegeven:
Uit de uitvoer blijkt dat de kaartgegevens nu met succes naar het JSON-formaat zijn geconverteerd.
Hoe JSON API ophalen en de gegevens ervan in een kaart converteren?
De JSON-gegevens die van de API worden ontvangen, kunnen ook rechtstreeks worden omgezet in Map door gebruik te maken van dezelfde aanpak die hierboven in de eerste sectie is beschreven. Om dit te doen, moet de API eerst worden opgehaald en vervolgens worden de opgehaalde JSON-gegevens omgezet in de kaart, zoals hieronder weergegeven:
< script >asynchroon functie convertJSONApi ( ) {
poging {
const res = wachten op ophalen ( 'https://jsonplaceholder.typicode.com/todos/' ) ;
const jsonFormat = wacht op res. json ( ) ;
const kaartFormaat = nieuw Kaart ( Voorwerp . inzendingen ( jsonFormat ) ) ;
troosten. loggen ( kaartFormaat ) ;
} vangst ( oorzaakFout ) {
troosten. fout ( 'Fout bij ophalen of converteren van gegevens:' , oorzaakFout ) ;
}
}
convertJSONApi ( ) ;
script >
De beschrijving van de bovenstaande code vindt u hieronder:
- Ten eerste wordt de asynchrone functie genoemd “convertJSONApi()” wordt gedefinieerd door het trefwoord “async” achter de functie te gebruiken “trefwoord” .
- Gebruik vervolgens de 'poging' blokkeren en creëren “const” type variabele “res” waarin de opgehaalde gegevens van de API worden opgeslagen. Het ophalen gebeurt door de API-link in het 'ophalen()' methode. Bevestig ook de 'wachten' trefwoord hierachter 'ophalen()' methode om te wachten op de aankomst van alle API-gegevens.
- Pas vervolgens de “json()” methode op de “res” variabele om alle ontvangen of opgehaalde gegevens te lezen. De 'wachten' trefwoord wordt er ook achter toegepast om te wachten tot het lezen van de gegevens is voltooid. Geef het resultaat door in de genoemde variabele 'jsonFormat' .
- Daarna werd de 'jsonFormat' wordt doorgegeven binnen de genoemde methode “Object.entries()” om een geneste array voor de verstrekte gegevens te maken. Dit wordt vervolgens doorgegeven in de 'Kaart()' constructor om de arrays naar Map te converteren en wordt opgeslagen in de 'Kaart' exemplaar genoemd “kaartformaat” .
- Deze opgehaalde JSON API, die nu wordt geconverteerd naar Map, wordt vervolgens op de console weergegeven door de “kaartformaat” variabele binnen de “console.log()” methode.
- Om eventuele veroorzaakte fouten tijdens het hele proces op te sporen, gebruikt u de 'vangst' blok en geef daarin een dummy-parameter door die opgetreden fouten bevat en om deze af te handelen wordt een dummy-bericht weergegeven.
De uitvoer na voltooiing van de bovenstaande code wordt hieronder weergegeven:
De uitvoer laat zien dat de gegevens in JSON-formaat zijn opgehaald uit de meegeleverde API en dat deze gegevens vervolgens zijn omgezet in de kaart.
U hebt kennis gemaakt met het proces om JSON naar Map en Map naar JSON in JavaScript te converteren.
Conclusie
Om JSON-gegevens naar Map te converteren, zijn methoden zoals “JSON.parse()” En “Object.entries()” worden gebruikt. De eerste parseert de JSON-gegevens en de tweede creëert een geneste array van geparseerde gegevens. In het geval van het converteren van kaartgegevens naar JSON-indeling, wordt de “Object.fromEntries()” En “JSON.stringify()” Er worden methoden gebruikt die gegevens naar een geneste array converteren en deze respectievelijk naar JSON-indeling converteren. In deze blog wordt de procedure uitgelegd om JSON van en naar een kaart in JavaScript te converteren.