Útmutató a JSON.parse() és a JSON.stringify() használatához

Hark Labs2022-04-28 · 4 min read

Útmutató a JSON.parse() és a JSON.stringify() használatához

JSON a JavaScript Object Notation rövidítése. Arra használják, hogy leírják a JavaScript objektumokat. Ez egy adatmegosztási formátum, amely kulcs-érték párok segítségével határozza meg az adatértékeket. A JSON objektumot az összes főbb böngésző támogatja. Ez az útmutató feltételezi, hogy jártas a JavaScript használatában és a JSON objektumok kezelésében. Ha szeretne megismerkedni a JSON-nal, tekintse meg a JSON adatmegosztási formátum áttekintését. Azt is megnézheti, hogyan kell dolgozni a JSON-nal JavaScriptben.

A JSON formátumot hálózaton keresztüli adatátvitelre is használják. Ebből a célból az adatokat szerializálni és deszerializálni kell. Amikor az adatok JSON formátumban vannak, egy karakterlánccá alakulnak a stringify metódus segítségével. Ahhoz, hogy az adatokat visszaalakítsuk objektum formátumba a manipulációhoz, a parse metódust használjuk. Ez az útmutató bemutatja a használatának lépéseit a JSON.parse() és a JSON.stringify() metódusok esetében. Kezdjük el!

JSON.parse()

Ez a metódus egy JSON karakterlánc JSON objektummá történő átalakítására szolgál, hogy az programozottan manipulálható legyen. Az átadott karakterláncnak érvényes JSON karakterláncnak kell lennie, különben kivétel keletkezik. Ez a karakterlánc bármilyen webszolgáltatástól vagy távoli alkalmazástól érkezhet.

Ez a metódus két paramétert fogad el: egy string és egy callback függvényt, amellyel a karakterlánc manipulálható, mielőtt objektummá alakítanánk. Tegyük fel, hogy egy webszolgáltatástól kapunk egy üzenetet, amely jelzi a művelet állapotát, az üzenetet és az állapotkódot. Alább látható egy egyszerű példa arra, hogyan alakítható át egy karakterlánc objektummá.

Kód:

let json_string = '{"message":"Done with success", "status":200, "code":200}'
let server_obj = JSON.parse(json_string);
console.log(server_obj)

let json_string = '{"message":"Done with success", "status":200, "code":200}'

let server_obj = JSON.parse(json_string);

console.log(server_obj)

Kimenet:

{message: 'Done with success', status: 200, code: 200}

1	{message: 'Done with success', status: 200, code: 200}

Gyakori probléma, ha a karakterlánc végére felesleges vesszők kerülnek, így a JSON.parse() hibát dob, ha a neki átadott karakterlánc végén vesszők vannak. Ha módosítani szeretné az értékeket, átadhatja a callbackfüggvényt második argumentumként.

Kód:

let string = '{"name":"XYZ","email":"xyz@example.com"}';
let obj = JSON.parse(string, (key, value) => {
    if (typeof value === 'string') {
        return value.toUpperCase();
    }
return value;
});

console.log(obj)

let string = '{"name":"XYZ","email":"xyz@example.com"}';

let obj = JSON.parse(string, (key, value) => {

if (typeof value === 'string') {

return value.toUpperCase();

}

return value;

});

console.log(obj)

Kimenet:

{name: 'XYZ', email: 'XYZ@EXAMPLE.COM'}

1	{name: 'XYZ', email: 'XYZ@EXAMPLE.COM'}

JSON.stringify()

A stringify metódus pontosan az ellenkezőjét teszi, mint a parse metódus. Itt a JSON objektumot adjuk át, és a visszatérési érték egy karakterlánc. Ez a karakterlánc továbbítható például egy másik távoli webszolgáltatásnak, majd újra elemezhető egy JSON objektummá a manipulációhoz.

Kód:

let obj = {message:"Done with success", status:200, code:200}
let str = JSON.stringify(obj);
console.log(str);

let obj = {message:"Done with success", status:200, code:200}

let str = JSON.stringify(obj);

console.log(str);

Kimenet:

{"message":"Done with success","status":200,"code":200}

1	{"message":"Done with success","status":200,"code":200}

A stringify metódus két argumentumot fogadhat: a replacerés a spacer metódusokat. A replacer metódus használható a karakterláncban lévő értékek helyettesítésére vagy kizárására.

Kód:

let obj = {message:"Done with success", status:200, code:200}
let str = JSON.stringify(obj, (key, value) => {
    if (status === 200) {
        return undefined;
    }
    return value;
});

console.log(str)

let obj = {message:"Done with success", status:200, code:200}

let str = JSON.stringify(obj, (key, value) => {

if (status === 200) {

return undefined;

}

return value;

});

console.log(str)

Kimenet:

{"message":"Sikeresen elvégezve","status":200,"code":200}

1	{"message":"Sikeresen elvégezve","status":200,"code":200}

Amikor a spacer argumentum meg van adva, a tömb vagy objektum minden egyes eleme új sorba kerül, és behúzással jelzi a mélységét az objektumok és tömbök hierarchiájában. Az alábbi egyszerű kódrészlet ezt szemlélteti.

Kód:

let obj = {message:"Sikeresen elvégezve", status:200, code:200}
let str = JSON.stringify(obj, null, "---");
console.log(str)

let obj = {message:"Sikeresen elvégezve", status:200, code:200}

let str = JSON.stringify(obj, null, "---");

console.log(str)

Kimenet:

{
---"message": "Sikeresen elvégezve",
---"status": 200,
---"code": 200
}

{

---"message": "Sikeresen elvégezve",

---"status": 200,

---"code": 200

}

Összefoglalás

Ebben az útmutatóban két hasznos módszert mutattunk be a JSON-formátumú adatok kezelésére. A JSON-objektumok mindenhol jelen vannak, és a JavaScriptet használó modern alkalmazások fejlesztése során ezek a módszerek rendkívül hasznosak. Ha többet szeretne megtudni, olvassa el az alábbi útmutatókat a blogunkon:

Kellemes kódolást!

Hark Labs

Szerző · CloudSigma

Preslav Dobrev a CloudSigma kreatív tervezője, aki hagyományos és innovatív marketingcsatornák segítségével következetes vállalati identitás kialakítására összpontosít. Kiemelkedően képes ötvözni a művészi látásmódot a stratégiai marketinggel, hogy hatásos márkatörténeteket hozzon létre.

Útmutató a JSON.parse() és a JSON.stringify() használatához

JSON.parse()

JSON.stringify()

Összefoglalás

Hark Labs

Hozzászólások