Miten JSON toimii Javascriptissä

Johdanto

koska JSON on johdettu JavaScript-ohjelmointikielestä, on luonteva valinta käyttää sitä Datamuotona Javascriptissä. JSON, lyhenne sanoista JavaScript Object Notation, lausutaan yleensä nimen ” Jason.”

saadaksesi lisätietoja JSONISTA yleisellä tasolla, lue ”An Introduction to JSON” – opetusohjelma.

Jos haluat alkaa miettiä, missä Jsonia voi käyttää JavaScript-ohjelmissasi, JSONin yleisiä käyttötapauksia ovat:

• tietojen tallentaminen
• tietorakenteiden luominen käyttäjän syötöstä
• tietojen siirtäminen palvelimelta asiakkaalle, asiakas palvelimelle ja palvelin palvelimelle
• tietojen määrittäminen ja tarkistaminen

Tämä opetusohjelma antaa sinulle johdannon työskentelyyn JSONin kanssa Javascriptissä. Jotta hyödyntää tätä johdantoa, sinun pitäisi olla jonkin verran perehtyneisyyttä JavaScript – ohjelmointikielen.

JSON Format

JSONin formaatti on johdettu JavaScript-objekti-syntaksista, mutta se on täysin tekstipohjainen. Se on avainarvon tietomuoto, joka on tyypillisesti renderöity kihara olkaimet.

kun työskentelet JSONin kanssa, näet todennäköisesti JSON-objektit .json – tiedostossa, mutta ne voivat olla olemassa myös JSON-objektina tai merkkijonona ohjelman yhteydessä. Lue lisää syntaksista ja rakenteesta täältä.

kun työskentelet .json tiedoston kanssa, se näyttää tältä:

{ "first_name" : "Sammy", "last_name" : "Shark", "online" : true }

Jos sen sijaan sinulla on JSON-objekti .js tai .html tiedosto, näet sen todennäköisesti muuttujaksi:

var sammy = { "first_name" : "Sammy", "last_name" : "Shark", "online" : true }

lisäksi JSON saatetaan nähdä merkkijonona eikä objektina JavaScript-ohjelmatiedoston tai skriptin yhteydessä. Tällöin kaiken voi nähdä myös yhdellä rivillä:

var sammy = '{"first_name" : "Sammy", "last_name" : "Shark", "location" : "Ocean"}';

JSON-objektien muuntaminen merkkijonoiksi voi olla erityisen hyödyllistä datan nopeassa siirtämisessä.

olemme käyneet läpi JSONin yleisen formaatin ja miten sen voi olettaa näkevän .json tiedostona, tai JavaScriptin sisällä objektina tai merkkijonona.

Vertailu JavaScript-objektiin

kannattaa pitää mielessä, että JSON on kehitetty minkä tahansa ohjelmointikielen käyttöön, kun taas JavaScript-objekteja voi työstää vain suoraan JavaScript-ohjelmointikielen kautta.

syntaksiltaan JavaScript-objektit muistuttavat JSONIA, mutta JavaScript-objektien näppäimet eivät ole merkkijonoja lainausmerkeissä. Myös JavaScript-objektit ovat vähemmän rajoitettuja arvoille siirrettyjen tyyppien suhteen, joten ne voivat käyttää funktioita arvoina.

katsotaanpa esimerkkiä sivuston käyttäjän Sammy Sharkista, joka on tällä hetkellä verkossa.

var user = { first_name: "Sammy", last_name : "Shark", online : true, full_name : function() { return this.first_name + " " + this.last_name; }};

Tämä näyttää hyvin tutulta JSON-objektina, mutta yhdenkään avaimen ympärillä ei ole lainausmerkkejä (first_namelast_nameonline, tai full_name), ja viimeisellä rivillä on funktion arvo.

Jos haluamme käyttää yllä olevan JavaScript-objektin tietoja, voisimme käyttää pistetunnistetta kutsuaksemme user.first_name; ja saadaksemme merkkijonon, mutta jos haluamme käyttää koko nimeä, meidän on tehtävä se kutsumalla user.full_name();, koska se on funktio.

JavaScript-objektit voivat olla olemassa vain JavaScript-kielen sisällä, joten kun työskentelet tietojen kanssa, joihin on päästävä eri kielillä, on parasta valita JSON.

pääsy JSON-tietoihin

JSON-tietoihin pääsee yleensä Javascriptissä pistemerkinnän kautta. Ymmärtääksemme, miten tämä toimii, tarkastellaan JSON-objektia sammy:

var sammy = { "first_name" : "Sammy", "last_name" : "Shark", "online" : true }

käyttääksemme jotakin arvoista, käytämme pistetunnistetta, joka näyttää tältä:

sammy.first_namesammy.last_namesammy.online

muuttuja sammy on ensimmäinen, jonka jälkeen tulee piste, jota seuraa Avaintieto.

Jos haluat luoda JavaScript-hälytyksen, joka näyttää avaimeen liittyvän arvon first_name ponnahdusikkunassa, voimme tehdä sen kutsumalla JavaScriptiä alert() funktioksi:

alert(sammy.first_name);

Output
Sammy

tässä on onnistuneesti kutsuttu first_name avain sammy JSON-objekti.

Voimme käyttää myös neliön kiinnikkeen syntaksia JSONin tietojen saamiseksi. Tätä varten pitäisimme avaimen kaksinkertaisina lainausmerkeinä hakasulkeissa. Meidän sammy muuttuja yllä, käyttäen neliösulkusyntaksia alert() funktio näyttää tältä:

alert(sammy);

Output
true

kun työskentelet sisäkkäisten matriisielementtien kanssa, sinun tulee soittaa ryhmäsi kohteen numero. Tarkastellaan jsonia alla:

var user_profile = { "username" : "SammyShark", "social_media" : }

päästäkseen merkkijonoon facebook, voimme kutsua kyseistä alkiota jonossa pistetiedon yhteydessä:

alert(user_profile.social_media.description);

Output
facebook

huomaa, että jokaisesta sisäkkäisestä alkuaineesta käytetään lisäpistettä.

käyttämällä piste-notaatiota tai neliösulkusyntaksia pääsemme käsiksi JSON-formaatin sisältämiin tietoihin.

funktiot JSONin kanssa työskentelyyn

tässä jaksossa tarkastellaan kahta menetelmää JSONin stringifioimiseksi ja jäsentämiseksi. Mahdollisuus muuntaa JSON objektista merkkijonoksi ja päinvastoin on hyödyllistä siirtää ja tallentaa tietoja.

JSON.stringify ()

JSON.stringify() funktio muuntaa objektin JSON-merkkijonoksi.

merkkijonoja voidaan käyttää tiedon siirtämiseen asiakkaalta palvelimelle tallentamalla tai välittämällä tietoa kevyellä tavalla. Voit esimerkiksi kerätä käyttäjän asetuksia asiakaspuolella ja lähettää ne sitten palvelimelle. Myöhemmin voit sitten lukea tiedot JSON.parse() – menetelmällä ja työstää tietoja tarpeen mukaan.

tarkastelemme JSON-objektia, jonka määrittelemme muuttujalle obj, ja sitten muunnamme sen käyttämällä JSON.stringify() siirtämällä obj funktiolle. Tämän merkkijonon voi antaa muuttujalle s:

var obj = {"first_name" : "Sammy", "last_name" : "Shark", "location" : "Ocean"}var s = JSON.stringify(obj)

nyt, jos työskentelemme s, JSON on käytettävissämme merkkijonona eikä objektina.

'{"first_name" : "Sammy", "last_name" : "Shark", "location" : "Ocean"}'

JSON.stringify() funktion avulla voidaan muuntaa objekteja merkkijonoiksi. Päinvastaiseen suuntaan katsotaan JSON.parse() funktio.

JSON.jäsennys ()

merkkijonot ovat hyödyllisiä kuljetukseen, mutta haluat pystyä muuntamaan ne takaisin JSON-objektiksi asiakkaan ja/tai palvelimen puolella. Vaikka tekstin voi muuntaa objektiksi eval() funktiolla, se ei ole kovin turvallinen, joten käytämme sen sijaan JSON.parse() funktiota.

muunnetaan esimerkki JSONISSA.stringify () – osio edellä, siirtäisimme merkkijonon s funktiolle ja määrittäisimme sen uudeksi muuttujaksi:

var o = JSON.parse(s)

sitten meillä olisi objekti o työstettäväksi, joka olisi identtinen objektin kanssa obj.

syvempää tarkastelua varten tarkastellaan esimerkkiä JSON.parse() HTML-tiedoston yhteydessä:

<!DOCTYPE html><html><body><p></p><script>var s = '{"first_name" : "Sammy", "last_name" : "Shark", "location" : "Ocean"}';var obj = JSON.parse(s);document.getElementById("user").innerHTML ="Name: " + obj.first_name + " " + obj.last_name + "<br>" +"Location: " + obj.location;</script></body></html>

Output
Name: Sammy SharkLocation: Ocean

HTML-tiedoston yhteydessä voidaan nähdä, miten JSON-merkkijono s muutetaan objektiksi, joka on noudettavissa sivun lopullisessa renderöinnissä käyttämällä jsonia pistemerkinnän kautta.

JSON.parse() on turvallinen funktio jäsentää JSON-merkkijonoja ja muuntaa ne olioiksi.

Conclusion

JSON on Javascriptissä käytettävä luonnollinen formaatti, ja sillä on monia toteutuksia käytössä monilla suosituilla ohjelmointikielillä. Jos haluat käyttää formaattia toisella progamointikielellä, voit nähdä täyden kielituen ”Introducing JSON” – sivustolla.

koska se on kevyt ja helposti siirrettävä ohjelmointikielten ja järjestelmien välillä, JSON on kokenut lisääntyneen tuen sovellusliittymissä, mukaan lukien Twitter-API.