JSON adalah format integrasi data ringan yang terutama digunakan untuk menyimpan dan mengangkut data dari satu server atau sistem ke server atau sistem lainnya. Di sisi lain, Peta juga menyimpan data dan menggunakan format nilai kunci dimana kunci dapat memiliki tipe data apa pun. Pengembang dapat mengambil data tertentu dengan memilih kunci yang sesuai.
Artikel ini menjelaskan proses untuk mengonversi JSON ke/dari Peta di JavaScript dengan mencakup bagian berikut:
- Bagaimana Mengonversi Data JSON ke Peta di JavaScript?
- Bagaimana Mengonversi Data JSON Dari Peta di JavaScript?
- Cara Mengambil API JSON dan Mengubah Datanya Menjadi Peta
Bagaimana Mengonversi Data JSON ke Peta di JavaScript?
Mengonversi data JSON menjadi Peta mempertahankan format pasangan nilai kunci sebagai 'Peta' dan juga menyimpan data dalam bentuk nilai kunci seperti JSON. Jadi, pengembang dapat mempertahankan urutan asli kunci yang tidak dijamin dengan konversi objek JavaScript. Konversi “JSON” data ke dalam 'Peta' menawarkan lebih banyak fleksibilitas dan memungkinkan pengembang menggunakan metode bawaan Peta untuk memberikan kemudahan saat melintasi data.
Mari kunjungi blok kode di bawah ini tempat data hard-code JSON akan diubah menjadi Peta:
< jenis skrip = 'teks/javascript' >
konstanta jsonFormat = '{'author1':'Jackson','author2':'Reed','author3':'Tasha','author4':'Petterson'} ' ;
konstanta format peta = baru Peta ( Obyek . entri ( JSON. menguraikan ( jsonFormat ) ) ) ;
menghibur. catatan ( format peta ) ;
naskah >
Penjelasan kode di atas dinyatakan sebagai:
- Pertama, buat variabel tipe const bernama 'jsonFormat' berisi data dalam format JSON yaitu dalam format nilai kunci.
- Selanjutnya, buat instance baru dari Map dengan nama 'Format peta' . Untuk mengurai data JSON, teruskan 'Format peta' di dalam “JSON.mengurai()” metode.
- Kemudian, teruskan hasil yang dikembalikan oleh metode ini ke dalam “Objek.entri()” untuk membuat array dari array dan setiap array bagian dalam mewakili pasangan nilai kunci.
- Lewatkan hasil akhir atau semua metode ini ke arah penyelarasan yang tepat di dalam 'Peta' konstruktor. Sekarang, contohnya 'Format peta' berisi data JSON yang dikonversi yang ditampilkan melalui jendela konsol menggunakan “konsol.log()” metode.
Setelah kode di atas dikompilasi, jendela konsol akan terlihat seperti ini:
Outputnya mengonfirmasi bahwa data JSON telah diubah menjadi Peta. Untuk informasi lebih lanjut dan contoh mengubah data JSON menjadi array atau Peta, Anda dapat mengunjungi kami yang lain artikel .
Bagaimana Mengonversi Data JSON Dari Peta di JavaScript?
Mengonversi data ke format JSON meningkatkan ketersediaan seumur hidup dan memungkinkan Anda mengirim data ini ke mana saja melalui jaringan tanpa kehilangan data. Selain itu, format JSON mudah dibaca manusia dan dapat digunakan di API web atau file konfigurasi. Dalam program di bawah ini, data Peta akan diubah ke dalam format JSON:
< jenis skrip = 'teks/javascript' >konstanta format peta = baru Peta ( [
[ 'penulis1' , 'Jackson' ] ,
[ 'penulis2' , 'buluh' ] ,
[ 'penulis3' , 'Tasha' ] ,
[ 'penulis4' , 'Peterson' ] ,
] ) ;
konstanta jsonFormat = JSON. merangkai ( Obyek . dari Entri ( format peta ) ) ;
menghibur. catatan ( jsonFormat ) ;
naskah >
Penjelasan blok kode di atas dinyatakan sebagai:
- Pertama, nama instance 'Format peta' dibuat untuk Peta yang berisi beberapa entri.
- Selanjutnya, “Objek.dariEntries()” metode yang digunakan dan 'Format peta' diteruskan ke sana. Ini akan mengubah data Peta yang disediakan menjadi array bersarang.
- Kemudian, array yang disarangkan diteruskan ke “JSON.stringify()” metode untuk mengonversi array bersarang ke dalam format JSON sambil mempertahankan keselarasan pasangan nilai kunci.
- Pada akhirnya, data format JSON yang dihasilkan akan ditampilkan melalui jendela konsol.
Output yang dihasilkan setelah kompilasi kode di atas ditunjukkan di bawah ini:
Outputnya menunjukkan bahwa data Peta kini berhasil diubah ke dalam format JSON.
Bagaimana Cara Mengambil API JSON dan Mengubah Datanya Menjadi Peta?
Data JSON yang diterima dari API juga dapat langsung diubah menjadi Peta dengan menggunakan pendekatan yang sama seperti yang dijelaskan di atas pada bagian pertama. Untuk melakukan hal ini, API harus diambil terlebih dahulu kemudian data JSON yang diambil diubah menjadi Peta, seperti yang ditunjukkan di bawah ini:
< naskah >asinkron fungsi konversiJSONApi ( ) {
mencoba {
konstanta res = menunggu pengambilan ( 'https://jsonplaceholder.typicode.com/todos/' ) ;
konstanta jsonFormat = tunggu res. json ( ) ;
konstanta format peta = baru Peta ( Obyek . entri ( jsonFormat ) ) ;
menghibur. catatan ( format peta ) ;
} menangkap ( penyebab Kesalahan ) {
menghibur. kesalahan ( 'Kesalahan saat mengambil atau mengonversi data:' , penyebab Kesalahan ) ;
}
}
konversiJSONApi ( ) ;
naskah >
Deskripsi kode di atas dinyatakan di bawah ini:
- Pertama, beri nama fungsi asinkron “konversiJSONApi()” didefinisikan dengan menggunakan kata kunci “async” di belakang fungsi “kata kunci” .
- Selanjutnya, gunakan 'mencoba' blok dan buat a “konstan” tipe variabel 'res' yang akan menyimpan data yang diambil dari API. Pengambilan dilakukan dengan memasukkan link API ke dalam 'mengambil()' metode. Lampirkan juga 'menunggu' kata kunci di balik ini 'mengambil()' metode untuk menunggu kedatangan semua data API.
- Kemudian, terapkan “json()” metode pada variabel “res” untuk membaca semua data yang diterima atau diambil. Itu 'menunggu' kata kunci juga diterapkan di belakangnya untuk menunggu selesainya pembacaan data. Berikan hasilnya ke variabel bernama 'jsonFormat' .
- Setelah itu, 'jsonFormat' diteruskan di dalam metode bernama “Objek.entri()” untuk membuat array bersarang untuk data yang disediakan. Ini kemudian diteruskan ke dalam 'Peta()' konstruktor untuk mengubah array menjadi Peta dan disimpan di 'Peta' contoh bernama 'Format peta' .
- API JSON yang diambil ini yang sekarang diubah menjadi Peta kemudian ditampilkan di konsol dengan menampilkan 'Format peta' variabel di dalam “konsol.log()” metode.
- Untuk mengetahui kesalahan apa pun yang terjadi selama keseluruhan proses, gunakan 'menangkap' memblokir dan meneruskan parameter dummy di dalamnya yang berisi kesalahan yang terjadi dan untuk menanganinya menampilkan pesan dummy.
Output setelah selesainya kode di atas adalah sebagai berikut:
Outputnya menunjukkan bahwa data berformat JSON telah diambil dari API yang disediakan dan kemudian data ini diubah menjadi Peta.
Anda telah mempelajari proses mengonversi JSON ke Map dan Map ke JSON di JavaScript.
Kesimpulan
Untuk mengonversi data JSON ke Peta, metode seperti “JSON.mengurai()” Dan “Objek.entri()” digunakan. Yang pertama mem-parsing data JSON, dan yang kedua membuat array bersarang dari data yang diurai. Dalam hal mengonversi data Peta ke format JSON, file “Objek.dariEntries()” Dan “JSON.stringify()” metode digunakan yang akan mengubah data menjadi array bersarang dan mengubahnya menjadi format JSON masing-masing. Blog ini telah menjelaskan prosedur untuk mengkonversi JSON ke dan dari Peta di JavaScript.