Cara Menggunakan JSON.parse () dan json.Stringify ()

Cara Menggunakan JSON.parse () dan json.Stringify ()

Json bermaksud notasi objek JavaScript. JSON adalah format data yang boleh dibaca manusia yang biasa digunakan untuk menukar data antara pelayar web, pelanggan dan pelayan. Sebilangan besar API moden menggunakan format JSON sebagai output. Itulah sebabnya JSON menjadi format data popular untuk output API.

JavaScript menyediakan dua kaedah untuk bekerja dengan kandungan JSON. Parse dan Stringify. Kaedahnya adalah JSON.parse () dan json.Stringify ().

  • Json.Parse () Kaedah mengambil rentetan json dan mengubahnya menjadi objek JavaScript.
  • Json.Stringify () kaedah mengambil objek JavaScript dan mengubahnya menjadi rentetan JSON.

1. Menggunakan JSON.Parse ()

JSON.fungsi parse () mengambil input data JSON dan mengubahnya menjadi objek JavaScript. Berikut adalah contoh mudah untuk menukar rentetan JSON menjadi objek JS.

// Store JSON Data dalam pembolehubah JavaScript var json = '"id": 1, "name": "Dan RADAK", "negara": "Amerika Syarikat"'; // Tukar tali json ke objek javascript var obj = json.Parse (JSON); // mengakses nilai individu dari konsol objek javascript.log (obj.ID); // output: 1 konsol.log (obj.nama); // output: Konsol Dan Rada.log (obj.negara); // output: Amerika Syarikat
12345678910// store json data dalam variablevar javascript json = '"id": 1, "name": "Dan Rada", "negara": "Amerika Syarikat"'; // tukar tali json ke javascript objectvar obj = json.Parse (JSON); // mengakses nilai individu dari objectconsole javascript.log (obj.ID); // output: 1console.log (obj.nama); // output: Dan Radakconsole.log (obj.negara); // output: Amerika Syarikat

Lulus fungsi - Anda juga boleh lulus fungsi sebagai hujah kedua (pilihan) kepada JSON.Parse () berfungsi untuk melaksanakan beberapa tugas pada setiap nilai JSON. Berikut adalah contoh fungsi yang mengubah semua nilai rentetan ke huruf besar dalam objek yang dikembalikan kaedah parse:

// Store JSON Data dalam pembolehubah JavaScript var json = '"id": 1, "name": "Dan RADAK", "negara": "Amerika Syarikat"'; // Tukar tali json ke objek javascript var obj = json.parse (json, (kunci, nilai) => if (typeof value === 'string') return value.Touppercase (); nilai pulangan; ); // mengakses nilai individu dari konsol objek javascript.log (obj.ID); // output: 1 konsol.log (obj.nama); // output: Konsol Dan Rada.log (obj.negara); // output: Amerika Syarikat
123456789101112131415// store json data dalam variablevar javascript json = '"id": 1, "name": "Dan Rada", "negara": "Amerika Syarikat"'; // tukar tali json ke javascript objectvar obj = json.parse (json, (kunci, nilai) => if (typeof value === 'string') return value.Touppercase (); nilai pulangan;); // mengakses nilai individu dari objectconsole javascript.log (obj.ID); // output: 1console.log (obj.nama); // output: Dan Radakconsole.log (obj.negara); // output: Amerika Syarikat

Kami menganggap, ini membantu anda memahami penggunaan JSON.kaedah parse (). Seterusnya, pelajari kaedah lain JSON.stringify () untuk melakukan sebaliknya di atas.

2. Menggunakan JSON.Stringify ()

Json.Kaedah Stringify () digunakan untuk mengubah objek JavaScript ke rentetan json. Anda hanya boleh lulus objek JavaScript ke fungsi ini dan dapatkan array JSON.

Berikut adalah contoh mudah JSON.Kaedah Stringify ():

// Buat objek JavaScript var obj = id: 1, nama: "Dan RADK", Negara: "Amerika Syarikat" // Menukar objek JS ke json string var json = json.stringify (obj); konsol.log (json); // output yang diharapkan: "id": 1, "name": "Dan RADAK", "negara": "Amerika Syarikat"
12345678// Buat objek JavaScript var obj = id: 1, nama: "Dan RADK", Negara: "Amerika Syarikat" // Menukar objek JS ke json stringvar json = json.stringify (obj); konsol.log (json); // output yang diharapkan: "id": 1, "name": "Dan RADAK", "negara": "Amerika Syarikat"

Anda juga boleh lulus dua hujah tambahan, satu adalah fungsi pengganti dan yang kedua boleh menjadi nilai ruang untuk memformat output.

Menggunakan fungsi pengganti - Fungsi pengganti digunakan untuk menapis nilai output. Contohnya, anda boleh membuat fungsi dan lulus sebagai hujah. Fungsi ini akan mengembalikan nilai rentetan seperti yang tidak ditentukan.

// objek javascript var obj = id: 1, nama: "Dan RADAK", Umur: 28, Negara: "Amerika Syarikat" Pengganti Fungsi (KEY, Nilai) // Penapisan Properties Jika (Typeof Value === 'String') return undefined; nilai pulangan; // Menggunakan konsol fungsi pengganti.log (json.stringify (obj, pengganti)); // output yang diharapkan: "id": 1, "umur": 28
1234567891011121314// objek javascript var obj = id: 1, nama: "Dan RADAK", Umur: 28, Negara: "Amerika Syarikat" Pengganti Fungsi (KEY, Nilai) // Penapisan Properties Jika (Typeof Value === 'String') return undefined; nilai pulangan; // Menggunakan fungsi penggantiConsole.log (json.stringify (obj, pengganti)); // output yang diharapkan: "id": 1, "umur": 28

Menggunakan array sebagai pengganti - Anda juga boleh lulus array yang mengandungi beberapa nama utama sebagai pengganti. Di sini fungsi Stringify () hanya akan mengembalikan nilai utama yang sepadan dengan kekunci yang dikemukakan sebagai pengganti.

Contohnya, kami menghantar ID dan nama dalam pelbagai fungsi pengganti. Dalam kes ini hanya nilai -nilai tersebut kembali sebagai objek JS dan membuang nilai lain.

// Buat objek javascript var obj = id: 1, nama: "Dan RADK", Umur: 28, Negara: "Amerika Syarikat" // Menukar objek JS ke JSON String dengan Array Replacer Console.log (json.stringify (obj, ["id", "name"])); // output yang diharapkan: "id": 1, "name": "Dan Rada"
123456// Buat objek JavaScript var obj = id: 1, Nama: "Dan Rada", Umur: 28, Negara: "Amerika Syarikat" // Menukar objek JS ke JSON String dengan array carianerConsole.log (json.stringify (obj, ["id", "name"])); // output yang diharapkan: "id": 1, "name": "Dan RADAK"

Lulus argumen ruang - Anda juga boleh lulus nilai ruang sebagai hujah pilihan ketiga. Ini membantu menghasilkan output dalam format yang lebih mudah dibaca.

// Buat objek JavaScript var obj = id: 1, nama: "Dan RADAK", Umur: 28, Negara: "Amerika Syarikat" // Pengganti Fungsi Pengganti Kosong (Key, Value) Return value; // Menggunakan konsol argumen ruang pilihan.log (json.stringify (obj, pengganti, "); // output yang diharapkan // //" id ": 1, //" name ":" Dan Rada ", //" umur ": 28, //" negara ":" Amerika Syarikat "// // Menggunakan tab sebagai konsol argumen ruang.log (json.stringify (obj, pengganti, '\ t'); // output yang diharapkan // // "id": 1, // "nama": "Dan RADAK", // "Umur": 28, // "negara": "Amerika Syarikat" //
1234567891011121314151617181920212222324252627// Buat objek JavaScript var obj = id: 1, nama: "Dan RADAK", Umur: 28, Negara: "Amerika Syarikat" // Pengganti Function Function Function Function (Key, Value) Return value; // Menggunakan argumen ruang pilihanConsole.log (json.stringify (obj, pengganti, "); // output yang diharapkan // //" id ": 1, //" name ":" Dan Rada ", //" umur ": 28, //" negara ":" Amerika Syarikat "// // Menggunakan tab sebagai argumen ruangconsole.log (json.stringify (obj, pengganti, '\ t'); // output yang diharapkan // // "id": 1, // "name": "Dan RADAK", // "Umur": 28, // "Negara ": "Amerika Syarikat"//

Kesimpulan

Dalam tutorial ini, anda telah mengetahui penggunaan JSON.parse () dan json.Kaedah Stringify ().