JS-zelfstudie

JS HOME JS Introductie JS Waarheen? JS-uitgang JS-verklaringen JS-syntaxis JS-opmerkingen JS-variabelen JS Let JS Const JS-operators JS Rekenen JS-opdracht JS-gegevenstypen JS-functies JS-objecten JS-evenementen JS-snaren JS String-methoden JS String zoeken JS String-sjablonen JS-nummers JS-nummermethoden JS-arrays JS-array-methoden JS-array sorteren JS-array-iteratie JS Array Const JS-datums JS-datumnotaties JS Datum Ophaalmethoden Methoden voor het instellen van JS-datum JS Math JS Willekeurig JS Booleans JS-vergelijkingen JS-voorwaarden JS-schakelaar JS Loop For JS-lus voor binnen JS Loop For Of JS-lus terwijl JS Break JS-iteraties JS-sets JS-kaarten JS Typeof JS Type conversie JS Bitwise JS RegExp JS-fouten JS-bereik JS Hijsen JS strikte modus JS dit trefwoord JS-pijlfunctie JS-lessen JS JSON JS-foutopsporing JS-stijlgids JS-best practices JS-fouten JS-prestaties JS Gereserveerde Woorden

JS-versies

JS-versies JS 2009 (ES5) JS 2015 (ES6) JS 2016 JS 2017 JS 2018 JS IE / Edge JS-geschiedenis

JS-objecten

Objectdefinities Objecteigenschappen Objectmethoden Objectweergave Objectaccessoires Objectconstructeurs Objectprototypes Object-Iterables Objectsets Objectkaarten Objectreferentie

JS-functies

Functiedefinities Functieparameters: Functie-aanroep Functie-oproep: Functie Toepassen Functie Sluitingen

JS-lessen

Klas Intro Klasse Overerving Klasse Statisch

JS Asynchrone

JS-callbacks JS asynchroon JS belooft JS Async/Wachten

JS HTML DOM

DOM Intro DOM-methoden DOM-document DOM-elementen DOM HTML DOM-formulieren DOM-CSS DOM-animaties DOM-evenementen DOM-gebeurtenisluisteraar DOM-navigatie DOM-knooppunten DOM-collecties DOM-knooppuntlijsten

JS-browserstuklijst

JS-venster JS-scherm JS-locatie JS-geschiedenis JS-navigator JS pop-upwaarschuwing JS-timing JS-koekjes

JS Web API's

Introductie web-API Web Forms API Webgeschiedenis-API Webopslag-API Web Worker-API Web Fetch-API Webgeolocatie-API

JS AJAX

Ajax-intro AJAX XMLHttp Ajax-verzoek Ajax-reactie AJAX XML-bestand AJAX PHP Ajax ASP AJAX-database AJAX-toepassingen Ajax-voorbeelden

JS JSON

JSON-intro JSON-syntaxis JSON versus XML JSON-gegevenstypen JSON ontleden JSON Stringify JSON-objecten JSON-arrays JSON-server JSON PHP JSON HTML JSON JSONP

JS versus jQuery

jQuery-kiezers jQuery HTML jQuery CSS jQuery DOM

JS-graphics

JS-graphics JS Canvas JS Plotly JS Chart.js JS Google-kaart JS D3.js

JS-voorbeelden

JS-voorbeelden JS HTML DOM JS HTML-invoer JS HTML-objecten JS HTML-evenementen JS-browser JS-editor JS-oefeningen JS-quiz JS-certificaat

JS-referenties

JavaScript-objecten HTML DOM-objecten


JSON .stringify()


Een veelgebruikt gebruik van JSON is het uitwisselen van gegevens van/naar een webserver.

Wanneer gegevens naar een webserver worden verzonden, moeten de gegevens een string zijn.

Converteer een JavaScript-object naar een tekenreeks met JSON.stringify().


Stringify een JavaScript-object

Stel je voor dat we dit object in JavaScript hebben:

const obj = {name: "John", age: 30, city: "New York"};

Gebruik de JavaScript-functie JSON.stringify()om het om te zetten in een string.

const myJSON = JSON.stringify(obj);

Het resultaat is een tekenreeks die de JSON-notatie volgt.

myJSONis nu een string en klaar om naar een server te worden verzonden:

Voorbeeld

const obj = {name: "John", age: 30, city: "New York"};
const myJSON = JSON.stringify(obj);

In de volgende hoofdstukken leert u hoe u JSON naar een server kunt sturen.


Stringify een JavaScript-array

Het is ook mogelijk om JavaScript-arrays te stringificeren:

Stel je voor dat we deze array in JavaScript hebben:

const arr = ["John", "Peter", "Sally", "Jane"];

Gebruik de JavaScript-functie JSON.stringify()om het om te zetten in een string.

const myJSON = JSON.stringify(arr);

Het resultaat is een tekenreeks die de JSON-notatie volgt.

myJSONis nu een string en klaar om naar een server te worden verzonden:

Voorbeeld

const arr = ["John", "Peter", "Sally", "Jane"];
const myJSON = JSON.stringify(arr);

In de volgende hoofdstukken leert u hoe u een JSON-string naar een server stuurt.


Gegevens bewaren

Bij het opslaan van gegevens moeten de gegevens een bepaald formaat hebben, en ongeacht waar u ervoor kiest om het op te slaan, tekst is altijd een van de legale indelingen.

JSON maakt het mogelijk om JavaScript-objecten als tekst op te slaan.

Voorbeeld

Gegevens opslaan in lokale opslag

// Storing data:
const myObj = {name: "John", age: 31, city: "New York"};
const myJSON = JSON.stringify(myObj);
localStorage.setItem("testJSON", myJSON);

// Retrieving data:
let text = localStorage.getItem("testJSON");
let obj = JSON.parse(text);
document.getElementById("demo").innerHTML = obj.name;


Uitzonderingen

Datums samenvoegen

In JSON zijn datumobjecten niet toegestaan. De JSON.stringify()functie converteert alle datums naar strings.

Voorbeeld

const obj = {name: "John", today: new Date(), city : "New York"};
const myJSON = JSON.stringify(obj);

Bij de ontvanger kunt u de string weer omzetten in een datumobject.


Stringify-functies

In JSON zijn functies niet toegestaan ​​als objectwaarden.

De JSON.stringify()functie verwijdert alle functies van een JavaScript-object, zowel de sleutel als de waarde:

Voorbeeld

const obj = {name: "John", age: function () {return 30;}, city: "New York"};
const myJSON = JSON.stringify(obj);

Dit kan worden weggelaten als u uw functies converteert naar tekenreeksen voordat u de JSON.stringify()functie uitvoert.

Voorbeeld

const obj = {name: "John", age: function () {return 30;}, city: "New York"};
obj.age = obj.age.toString();
const myJSON = JSON.stringify(obj);

Als u functies verzendt met JSON, verliezen de functies hun bereik en moet de ontvanger eval() gebruiken om ze weer in functies om te zetten.