Hogyan működik a JSON JavaScript

Bevezetés

mivel a JSON származik a JavaScript programozási nyelv, ez egy természetes választás használni, mint egy adatformátum JavaScript. JSON, rövid JavaScript Object Notation, általában ejtik, mint a név ” Jason.”

Ha többet szeretne megtudni a JSON-ról általánosságban, olvassa el a “bevezetés a JSON-ba” oktatóanyagot.

ahhoz, hogy elkezdjünk gondolkodni azon, hogy hol használhatod a JSON-t a JavaScript programjaidban, a JSON néhány általános felhasználási esete a következőket tartalmazza:

• adatok tárolása
• adatstruktúrák létrehozása felhasználói bemenetről
• adatok átvitele szerverről kliensre, kliensről szerverre és szerverről szerverre
• adatok konfigurálása és ellenőrzése

Ez a bemutató bemutatja a JSON használatát a JavaScript-ben. Ahhoz, hogy a lehető legjobban kihasználhassa ezt a bevezetést, ismernie kell a JavaScript programozási nyelvet.

JSON formátum

a JSON formátuma a JavaScript objektum szintaxisából származik, de teljesen szövegalapú. Ez egy kulcsértékű adatformátum, amelyet általában göndör zárójelben renderelnek.

amikor JSON-nal dolgozik, valószínűleg a JSON-objektumokat egy .json fájlban fogja látni, de JSON-objektumként vagy karakterláncként is létezhetnek EGY program kontextusában. Tudjon meg többet a szintaxisról és a struktúráról itt.

amikor egy .json fájllal dolgozik, ez így fog kinézni:

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

Ha ehelyett egy JSON objektum van egy .js vagy .html fájlban, akkor valószínűleg egy változóra lesz állítva:

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

ezenkívül a JSON karakterláncként, nem pedig objektumként jelenhet meg egy JavaScript programfájl vagy szkript kontextusában. Ebben az esetben az egészet egy sorban is láthatja:

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

a JSON objektumok karakterláncokká konvertálása különösen hasznos lehet az adatok gyors továbbításához.

áttekintettük a JSON általános formátumát, és azt, hogy hogyan lehet azt .json fájlként, vagy JavaScript-en belül objektumként vagy karakterláncként látni.

összehasonlítás a JavaScript objektummal

érdemes szem előtt tartani, hogy a JSON-t bármilyen programozási nyelv használatára fejlesztették ki, míg a JavaScript-objektumokkal csak közvetlenül a JavaScript programozási nyelven lehet dolgozni.

szintaxis szempontjából a JavaScript objektumok hasonlóak a JSON-hoz, de a JavaScript objektumok kulcsai nem idézőjelek. Ezenkívül a JavaScript objektumok kevésbé korlátozottak az értékekre átadott típusok tekintetében, így függvényeket használhatnak értékként.

nézzünk meg egy példát a weboldal felhasználójának, Sammy Sharknak a JavaScript objektumára, aki jelenleg online van.

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

Ez nagyon ismerősnek tűnik számodra, mint JSON objektum, de nincsenek idézetek a kulcsok körül (first_namelast_nameonline, vagy full_name), és van egy függvény értéke az utolsó sorban.

Ha hozzá akarunk férni a fenti JavaScript objektum adataihoz, használhatjuk a dot jelölést a user.first_name; hívásához, és kapunk egy karakterláncot, de ha a teljes nevet akarjuk elérni, akkor ezt a user.full_name(); hívásával kell megtennünk, mert ez egy függvény.

a JavaScript objektumok csak a JavaScript nyelven belül létezhetnek, ezért ha olyan adatokkal dolgozik, amelyekhez különböző nyelveken kell hozzáférni, akkor a legjobb, ha a JSON-t választja.

JSON-adatok elérése

a JSON-adatok általában Javascript-ben érhetők el pont jelöléssel. Hogy megértsük, hogyan működik ez, nézzük meg a JSON objektumot sammy:

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

bármely érték eléréséhez pontjelzést fogunk használni, amely így néz ki:

sammy.first_namesammy.last_namesammy.online

a változó sammy az első, amelyet egy pont követ, majd az elérendő kulcs.

egy JavaScript riasztás létrehozásához, amely megmutatja nekünk a kulcshoz társított értéket first_name egy előugró ablakban ezt a JavaScript alert() függvény meghívásával tehetjük meg:

alert(sammy.first_name);

Output
Sammy

itt sikeresen meghívtuk a first_namekulcshoz társított értéket a sammy JSON objektumból.

szögletes zárójel szintaxist is használhatunk a JSON adatainak eléréséhez. Ehhez a kulcsot dupla idézőjelben tartanánk szögletes zárójelben. A fentisammy változóhoz, szögletes zárójel szintaxist használva egy alert() függvény így néz ki:

alert(sammy);

Output
true

ha beágyazott tömbelemekkel dolgozik, hívja fel a tömbben lévő elem számát. Tekintsük az alábbi JSON-t:

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

a karakterlánc eléréséhez facebook, ezt az elemet a tömbben hívhatjuk a pontjelölés összefüggésében:

alert(user_profile.social_media.description);

Output
facebook

figyeljük meg, hogy minden beágyazott elemhez egy további pontot fogunk használni.

a pontjelzés vagy a szögletes zárójel szintaxis használata lehetővé teszi a JSON formátumban található adatok elérését.

funkciók a JSON használatához

Ez a rész két módszert fog megvizsgálni a JSON sztringelésére és elemzésére. A JSON konvertálása objektumról karakterláncra és fordítva hasznos az adatok átviteléhez és tárolásához.

JSON.stringify ()

a JSON.stringify() függvény egy objektumot JSON karakterláncgá alakít. a

karakterláncok hasznosak az adatok ügyfélről szerverre történő továbbításához az információk könnyű tárolásával vagy átadásával. Például összegyűjtheti a felhasználó beállításait az ügyféloldalon, majd elküldheti azokat egy szerverre. Később elolvashatja az információkat a JSON.parse() módszerrel, és szükség szerint dolgozhat az adatokkal.

megnézünk egy JSON objektumot, amelyet a obj változóhoz rendelünk, majd a JSON.stringify() használatával konvertáljuk a obj átadásával a függvényhez. Ezt a karakterláncot hozzárendelhetjük a s:

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

most, ha a s változóhoz, akkor a JSON karakterláncként, nem pedig objektumként lesz elérhető számunkra.

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

a JSON.stringify() funkció lehetővé teszi az objektumok karakterláncokká konvertálását. Ennek ellenkezőjéhez nézzük meg a JSON.parse() függvényt.

JSON.a parse ()

karakterláncok hasznosak a szállításhoz, de vissza szeretné konvertálni őket JSON objektummá a kliens és / vagy a szerver oldalon. Bár a eval() funkcióval konvertálhat szöveget objektummá, ez nem túl biztonságos, ezért a JSON.parse() funkciót fogjuk használni.

a példa konvertálása a JSON-ban.stringify() a fenti szakaszban átadnánk a s karakterláncot a függvénynek, és hozzárendelnénk egy új változóhoz:

var o = JSON.parse(s)

ezután a o objektummal dolgoznánk, amely azonos lenne az objektummal obj.

hogy mélyebben megnézzük, Vegyünk egy példát JSON.parse() egy HTML fájl kontextusában:

<!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

egy HTML fájl kontextusában láthatjuk, hogy a JSON karakterlánc s egy objektummá alakul, amely az oldal végleges megjelenítésekor visszakereshető a JSON pont jelöléssel történő elérésével.

JSON.parse() egy biztonságos funkció a JSON karakterláncok elemzésére és objektumokká konvertálására.

következtetés

a JSON egy természetes formátum, amelyet JavaScriptben lehet használni, és számos implementáció áll rendelkezésre számos népszerű programozási nyelven. Ha a formátumot egy másik progamming nyelven szeretné használni, akkor a teljes nyelvi támogatást a “JSON bemutatása” webhelyen láthatja.

mivel könnyű és könnyen átvihető a programozási nyelvek és rendszerek között, a JSON fokozott támogatást élvez az API-kban, beleértve a Twitter API-t is.