JSON.parse- ja JSON.stringify-perusteet
Muunna objektit JSON-merkkijonoiksi ja takaisin; tutustu lyhyesti replaceriin ja reviveriin; käsittele virheelliset syötteet turvallisesti
JSON.parse- ja JSON.stringify-perusteet on ilmainen JavaScript Academy-oppitunti CoddyKitissä. Tämä on oppitunti 1/3. Voit lukea tästä oppimispolusta kokonaan mitkä tahansa 3 oppituntia ilmaiseksi — sen jälkeen CoddyKit PRO avaa kaikki oppitunnit sekä käytännön harjoittelun sisäänrakennetulla koodieditorilla ja ympäri vuorokauden toimivalla tekoälytuutorilla. Oppitunti kuuluu JavaScript Academy-oppimispolkuun, ja edistymisesi synkronoituu verkon ja CoddyKit-sovelluksen välillä. JavaScript Academy-kurssilla on yhteensä 3 oppituntia.
Miksi JSON?
Tavoite: Sarjallistakaa ja jäsentäkää turvallisesti.
- JSON.stringify → merkkijono
- JSON.parse ← merkkijono
- replacer/reviver (esimerkki)
- Perusvinkit turvallisuuteen

stringify()
Käyttäkää JSON.stringify(value)-funktiota JSON-merkkijonon muodostamiseen. Luettavuutta varten antakaa space-parametrille luku, esimerkiksi 2.
// Turn a value into a JSON string
const user = { name: "Ayla", score: 12, active: true };
const json = JSON.stringify(user);
console.log("json:", json);
// Optional: pretty-print with spaces (2)
const pretty = JSON.stringify(user, null, 2);
console.log("pretty:", pretty);

parse()
JSON.parse(text) palauttaa arvon. Syötteen on oltava kelvollinen JSON-merkkijono.
// Parse a JSON string back to a value
const raw = "{\"name\":\"Ayla\",\"score\":12,\"active\":true}";
const value = JSON.parse(raw);
console.log("name:", value.name, "score:", value.score);

Replacer (stringify)
replacer(key, value) voi jättää kenttiä pois tai muokata niitä sarjallistamisen aikana, esimerkiksi piilottaa salasanat.
// Replacer: filter or transform keys during stringify
const account = { id: 7, password: "secret", role: "user" };
// Hide sensitive fields
function replacer(key, value) {
if (key === "password") return undefined; // drop it
return value;
}
const safeJson = JSON.stringify(account, replacer, 2);
console.log("safeJson:", safeJson);

Reviver (parse)
reviver(key, value) voi muuntaa arvoja jäsentämisen aikana, esimerkiksi merkkijonoja → Date-olioiksi.
// Reviver: convert specific strings back into richer types
const orderJson = "{\"when\":\"2024-06-01T10:00:00Z\",\"total\":25}";
function reviver(key, value) {
if (key === "when" && typeof value === "string") {
return new Date(value); // restore Date
}
return value;
}
const order = JSON.parse(orderJson, reviver);
console.log("is Date?", order.when instanceof Date);
console.log("total:", order.total);

Turvallisuus ja rajoitukset
Vinkit:
- Ympäröikää JSON.parse try/catch-rakenteella, kun syöte ei ole luotettua.
- Käyttäkää replaceria arkaluontoisten kenttien poistamiseen ennen kirjaamista tai jakamista.
- JSON ei säilytä funktioita eikä prototyyppitietoja, vaan sarjallistaa vain dataa.

stringify vai parse -koe
Pikatarkistus: Arvon sarjallistaminen.

Kertaus
Kertaus: Muuntakaa arvot JSON.stringify- ja JSON.parse-funktioilla. Käyttäkää replacer-funktiota kenttien suodattamiseen ja reviver-funktiota Date-tyyppisten tyyppien palauttamiseen. Lisätkää turvallisuuden vuoksi try/catch-rakenne.

Opi JavaScript tekoälytuutorin avulla — ilmaiseksi
Kirjoita ja suorita oikeaa koodia selaimessa, saa välitöntä apua tekoälytuutorilta ympäri vuorokauden ja jatka siitä, mihin jäit, verkossa tai sovelluksessa.
- Kurssit
- 59
- Oppitunnit
- 200
Usein kysytyt kysymykset
Onko oppitunti ”JSON.parse- ja JSON.stringify-perusteet” ilmainen?
Kyllä — voit lukea täällä verkossa kokonaan ilmaiseksi mitkä tahansa JavaScript Academy-oppimispolun 3 oppituntia, myös oppitunnin “JSON.parse- ja JSON.stringify-perusteet”. Sen jälkeen CoddyKit PRO avaa kaikki oppitunnit sekä interaktiiviset harjoitukset sisäänrakennetulla koodieditorilla ja ympäri vuorokauden toimivalla tekoälytuutorilla. JavaScript Academy-kurssilla on yhteensä 3 oppituntia.
Mitä opin oppitunnilla ”JSON.parse- ja JSON.stringify-perusteet”?
Muunna objektit JSON-merkkijonoiksi ja takaisin; tutustu lyhyesti replaceriin ja reviveriin; käsittele virheelliset syötteet turvallisesti Harjoittelet JavaScript Academy-aihetta koodilla, jonka suoritat suoraan selaimessa. Ympäri vuorokauden käytettävissä oleva tekoälytuutori vastaa kysymyksiisi oppitunnin aikana.
Tarvitsenko kokemusta aloittaakseni JavaScript Academy-opiskelun?
Aiempi kokemus ei ole tarpeen. CoddyKitin JavaScript Academy-oppimispolku sopii vasta-alkajista edistyneisiin, joten voit aloittaa tästä tai alusta ja edetä omaan tahtiisi. Tämä on oppitunti 1/3.
Kuinka kauan ”JSON.parse- ja JSON.stringify-perusteet”-oppitunnin suorittaminen kestää?
Useimmat CoddyKitin oppitunnit kestävät noin 5–10 minuuttia. Jokainen oppitunti on lyhyt ja interaktiivinen, joten edistyt tasaisesti ja voit jatkaa siitä, mihin jäit – sekä verkossa että sovelluksessa.
Voinko kirjoittaa ja suorittaa koodia tällä JavaScript Academy-oppitunnilla?
Kyllä. Jokainen JavaScript Academy-oppitunti sisältää sisäänrakennetun koodieditorin, joten voit kirjoittaa ja suorittaa oikeaa koodia suoraan selaimessa ja saada välitöntä palautetta tekoälyltä – paikallista asennusta ei tarvita.
Kaikki tämän kurssin oppitunnit
- JSON.parse- ja JSON.stringify-perusteet
- Rakenteinen kloonaus ja URLSearchParams
- Turvallisen JSON-jäsentämisen strategiat