{"id":52197,"date":"2024-12-16T14:41:02","date_gmt":"2024-12-16T07:41:02","guid":{"rendered":"https:\/\/www.rumahweb.com\/journal\/?p=52197"},"modified":"2024-12-16T14:41:04","modified_gmt":"2024-12-16T07:41:04","slug":"json-adalah","status":"publish","type":"post","link":"https:\/\/www.rumahweb.com\/journal\/json-adalah\/","title":{"rendered":"JSON: Pengertian, Fungsi, Syntax hingga Cara Kerjanya"},"content":{"rendered":"\n

JavaScript Object Notation<\/strong> atau yang sering disingkat dengan sebutan JSON adalah format pertukaran data berbasis text yang digunakan untuk pertukaran data antara server dengan client <\/em>dalam aplikasi berbasis web.<\/p>\n\n\n\n\n\n

Melalui artikel ini, Anda akan mempelajari banyak hal tentang JSON, mulai dari pengertian, fungsi, contoh Syntax, hingga cara kerjanya. Mari simak informasi selengkapnya. <\/p>\n\n\n\n

Apa itu JSON?<\/h2>\n\n\n\n

JSON adalah format file yang sering digunakan untuk pertukaran data antara client dengan server. Penggunaan JSON banyak ditemui saat Anda berprofesi sebagai web Developer karena JSON banyak digunakan untuk API. <\/p>\n\n\n\n

JSON kompatibel dengan banyak bahasa pemrograman ( C, C++<\/a>, Python, JavaScript, Java,Perl, PHP, dll) , environment, dan juga library. Semakin tertarik belajar JSON?<\/p>\n\n\n\n

Syntax JSON terlihat sederhana, dapat dipahami dengan mudah oleh manusia, dan juga mesin. JSON diketahui lebih ringan dari pada format pertukaran data yang menggunakan XML<\/a>.\u00a0<\/p>\n\n\n\n

Fungsi <\/h2>\n\n\n\n

JSON memiliki fungsi utama yang mirip dengan XML, yaitu digunakan untuk pertukaran dan penyimpanan data. Perbedaannya, JSON memiliki beberapa keunggulan sehingga lebih sering digunakan karena struktur code JSON lebih sederhana dan lebih ringan ketiga digunakan.<\/p>\n\n\n\n

Berikut ini adalah lima fungsi utama JSON (JavaScript Object Notation<\/em>):<\/p>\n\n\n\n

    \n
  1. Pertukaran Data Antara Sistem<\/strong>: JSON membantu untuk menukar data antara aplikasi dan server karena formatnya dangkal dan lebih mudah dibaca.<\/li>\n\n\n\n
  2. Penyimpanan Data<\/strong>: JSON dapat menerapkan penyimpanan data dalam file atau sistem manajemen basis data relasional (format terstruktur).<\/li>\n\n\n\n
  3. Modifikasi Perilaku Aplikasi Melalui Remote Control<\/strong>: JSON sangat cocok untuk membawa data dinamis dalam aplikasi web tanpa memuat ulang halaman (yaitu menggunakan AJAX).<\/li>\n\n\n\n
  4. Representasi Data Generik<\/strong>: JSON menyediakan skema standar \u2013 tidak bertele-tele, cukup mudah dibaca manusia, dan mudah diurai melalui berbagai bahasa pemrograman.<\/li>\n\n\n\n
  5. Integrasi Lintas Platform<\/strong>: Hampir semua bahasa pemrograman modern seperti JavaScript, Python, PHP, Java, dll. menggunakan JSON yang membuat integrasi teknologi relatif lebih mudah.<\/li>\n<\/ol>\n\n\n\n

    Syntax JSON<\/h2>\n\n\n\n

    Berikut ini perbandingan antara Syntax JSON vs syntax XML secara sederhana.<\/p>\n\n\n\n

    <users>\n\u00a0 \u00a0 <user>\n\u00a0 \u00a0 \u00a0 \u00a0 <username>Anggit<\/username> <lokasi>Solo<\/lokasi>\n\u00a0 \u00a0 <\/user>\n\u00a0 \u00a0 <user>\n\u00a0 \u00a0 \u00a0 \u00a0 <username>Joni<\/username> <lokasi>jogja<\/lokasi>\n\u00a0 \u00a0 <\/user>\n\u00a0 \u00a0 <user>\n\u00a0 \u00a0 \u00a0 \u00a0 <username>Deni<\/username> <lokasi>Jakarta<\/lokasi>\n\u00a0 \u00a0 <\/user>\n<\/users><\/code><\/pre>\n\n\n\n
    Bila diubah ke bentuk JSON menjadi sebagai berikut. <\/p>\n\n\n\n
    {\n\u00a0 \"users\": [\n\u00a0 \u00a0 {\n\u00a0 \u00a0 \u00a0 \"username\": \"Anggit\",\n\u00a0 \u00a0 \u00a0 \"lokasi\": \"Solo\"\n\u00a0 \u00a0 },\n\u00a0 \u00a0 {\n\u00a0 \u00a0 \u00a0 \"username\": \"Joni\",\n\u00a0 \u00a0 \u00a0 \"lokasi\": \"Jogja\"\n\u00a0 \u00a0 },\n\u00a0 \u00a0 {\n\u00a0 \u00a0 \u00a0 \"username\": \"Deni\",\n\u00a0 \u00a0 \u00a0 \"lokasi\": \"Jakarta\"\n\u00a0 \u00a0 }\n\u00a0 ]\n}<\/code><\/pre>\n\n\n\n
    Keterangan<\/strong>:<\/p>\n\n\n\n
    Elemen <users> diubah menjadi array users yang berisi objek-objek user. Kemudian setiap objek user berisi pasangan kunci-nilai untuk username dan lokasi.<\/p>\n\n\n\n
    Berikut adalah table perbandingan antara json dan xml.<\/p>\n\n\n
    \n
    \"perbandingan<\/a><\/figure>\n<\/div>\n\n\n
    Cara Kerja Penyimpanan data JSON<\/h2>\n\n\n\n
    Berikut cara kerja penyimpanan data JSON melibatkan:<\/p>\n\n\n\n
      \n
    1. Pembuatan Struktur Data:<\/strong> Mengatur data dalam bentuk objek atau array.

      Struktur data biasanya dibuat dalam bentuk array atau object, disesuaikan dengan format JSON. Contoh bila menggunakan JavaScript.\u00a0<\/li>\n<\/ol>\n\n\n\n
      let pengguna = {\n\u00a0 \u00a0 username: \"Anggit\",\n\u00a0 \u00a0 lokasi: \"Solo\"\n};<\/code><\/pre>\n\n\n\n
        \n
      1. Konversi ke JSON:<\/strong> Mengonversi objek atau array menjadi string JSON.

        Selanjutnya melakukan konversi ke dalam bentuk string JSON. Dalam langkah ini bisa diproses sesuai bahasa pemrograman yang digunakan.

        Contoh bila menggunakan JavaScript.\u00a0<\/li>\n<\/ol>\n\n\n\n
        let jsonString = JSON.stringify(pengguna);<\/code><\/pre>\n\n\n\n
        Keterangan<\/strong>:<\/p>\n\n\n\n
        Pada contoh ini \u2018JSON.stringify(pengguna)\u2019 melakukan konversi object \u2018pengguna\u2019 menjadi string JSON untuk dapat disimpan ataupun dikirim.<\/p>\n\n\n\n
          \n
        1. Penyimpanan Data JSON:<\/strong> Menyimpan string JSON ke dalam media penyimpanan seperti local storage, file, atau database.

          Selanjutnya string JSON dapat disimpan dalam berbagai media penyimpanan.\u00a0<\/li>\n<\/ol>\n\n\n\n
            \n
          • Local Storage Browser
            Sebagai contoh, ini dilakukan di Javascript.<\/li>\n<\/ul>\n\n\n\n
            localStorage.setItem(\"pengguna\", jsonString);<\/code><\/pre>\n\n\n\n
              \n
            • File JSON
              Data JSON disimpan dalam format file .json<\/strong><\/li>\n<\/ul>\n\n\n\n
              import json\n\nwith open('user_data.json', 'w') as file:\n\u00a0 \u00a0 json.dump(user, file)<\/code><\/pre>\n\n\n\n
                \n
              1. Pembacaan dan Parsing:<\/strong> Membaca dan mengurai data JSON kembali menjadi objek atau array untuk digunakan.<\/li>\n<\/ol>\n\n\n\n
                  \n
                • Local Storage Browser
                  Sebagai contoh, ini dilakukan di Javascript.<\/li>\n<\/ul>\n\n\n\n
                  let retrievedData = localStorage.getItem(\"user\");\nlet userObject = JSON.parse(retrievedData);\nconsole.log(userObject.username); \/\/ Output: Anggit<\/code><\/pre>\n\n\n\n
                    \n
                  • Membaca File JSON<\/li>\n<\/ul>\n\n\n\n
                    Bila menggunakan Python:<\/p>\n\n\n\n
                    with open('user.json', 'r') as file:\n\u00a0 \u00a0 user = json.load(file)\nprint(user['username'])\u00a0 # Output: Anggit<\/code><\/pre>\n\n\n\n
                      \n
                    1. Manipulasi dan Penggunaan Data:<\/strong> Menggunakan dan memodifikasi data sesuai kebutuhan aplikasi.<\/li>\n<\/ol>\n\n\n\n
                      Data JSON dapat dikembalikan ke bentuk Object atau Array untuk selanjutnya dapat dimanipulasi. Contoh dalam bentuk JavaScript:<\/p>\n\n\n\n
                      userObject.lokasi = \"Jakarta\";\u00a0 \/\/ Mengubah lokasi\nconsole.log(userObject.lokasi); \/\/ Output: Jakarta<\/code><\/pre>\n\n\n\n
                      Dengan cara ini, JSON menyediakan metode yang efisien dan mudah untuk menyimpan dan mengelola data dalam berbagai aplikasi.<\/p>\n\n\n\n
                      Belajar JSON Dasar<\/h2>\n\n\n\n
                      Sampailah kita pada pembahasan belajar JSON dasar. <\/p>\n\n\n\n
                      1. Struktur Data JSON<\/h3>\n\n\n\n
                      JSON memiliki 2 struktur data. <\/p>\n\n\n\n
                        \n
                      • Struktur Data Object<\/strong>: 
                        \u2018{ }\u2019 Struktur data object diapit oleh kurung kurawal.\u00a0<\/li>\n\n\n\n
                      • Struktur Data Array<\/strong>: 
                        \u2018[ ]\u2019 Struktur data array diapit oleh kurung siku.<\/li>\n<\/ul>\n\n\n\n
                        2. Element JSON<\/h3>\n\n\n\n
                          \n
                        • Object JSON<\/li>\n<\/ul>\n\n\n\n
                          Object JSON berisi kumpulan kunci dan nilai. Kunci berupa String sedangkan Nilai bisa berupa string, angka, object lain, array atau bisa juga \u2018null\u2019.<\/p>\n\n\n\n
                          {\n\u00a0 \"name\": \"Rudi\",\n\u00a0 \"age\": 30,\n\u00a0 \"isStudent\": true\n}<\/code><\/pre>\n\n\n\n
                            \n
                          • Array JSON<\/li>\n<\/ul>\n\n\n\n
                            Array berupa nilai. Nilai-nilainya bisa menggunakan format data apapun yang valid di dalam JSON. <\/p>\n\n\n\n
                            [\n\u00a0 \"Apel\",\n\u00a0 \"Pisang\",\n\u00a0 \"Cherry\"\n]<\/code><\/pre>\n\n\n\n
                            3. Penulisan JSON<\/h3>\n\n\n\n
                            Berikut ini aturan dasar dalam menulis JSON antara lain. <\/p>\n\n\n\n
                              \n
                            • Kunci dibuat menggunakan format string yang diapit oleh tanda petik.\u00a0<\/li>\n\n\n\n
                            • Nilai bisa berupa tipe data apapun yang valid di JSON (string, angka, boolean, array, objek, atau null).\u00a0<\/li>\n\n\n\n
                            • Setiap pasangan kunci nilai, dipisahkan dengan tanda koma.<\/li>\n\n\n\n
                            • Tidak ada komentar di JSON.<\/li>\n<\/ul>\n\n\n\n
                              Contoh JSON sederhana:<\/p>\n\n\n\n
                              {\n\u00a0 \"name\": \"Rudi\",\n\u00a0 \"age\": 30,\n\u00a0 \"hobbies\": [\"Reading\", \"Traveling\", \"Gaming\"],\n\u00a0 \"address\": {\n\u00a0 \u00a0 \"street\": \"Jalan Raya\",\n\u00a0 \u00a0 \"city\": \"Jogja\",\n\u00a0 \u00a0 \"state\": \"ID\"\n\u00a0 }\n}<\/code><\/pre>\n\n\n\n
                              4. Cara Menggunakan JSON<\/h3>\n\n\n\n
                                \n
                              • Mengonversi Object ke JSON<\/strong><\/li>\n<\/ul>\n\n\n\n
                                Anda dapat mengkonversi Object ke string JSON menggunakan bahasa pemrograman. Sebagai contoh, bila menggunakan JavaScript. <\/p>\n\n\n\n
                                let person = {\n\u00a0 name: \"Rudi\",\n\u00a0 age: 28,\n\u00a0 hobbies: [\"Reading\", \"Traveling\", \"Gaming\"]\n};\n\nlet jsonString = JSON.stringify(person);\nconsole.log(jsonString);<\/code><\/pre>\n\n\n\n
                                Output yang dihasilkan berupa string JSON.<\/p>\n\n\n\n
                                {\"name\":\"Rudi\",\"age\":28,\"hobbies\":[\"Reading\",\"Traveling\",\"Gaming\"]}<\/code><\/pre>\n\n\n\n
                                Mengonversi JSON ke Object. <\/strong><\/p>\n\n\n\n
                                Untuk mengubah string JSON menjadi Object kembali, di JavaScript Anda bisa menggunakan fungsi \u2018JSON.parse()\u2019:<\/p>\n\n\n\n
                                let jsonString = '{\"name\":\"Rudi\",\"age\":28,\"hobbies\":[\"Reading\",\"Traveling\",\"Gaming\"]}';\nlet person = JSON.parse(jsonString);\n\nconsole.log(person.name);\u00a0 \/\/ Output: Rudi<\/code><\/pre>\n\n\n\n
                                Kesimpulan<\/h2>\n\n\n\n
                                JSON adalah format pertukaran data berbasis text yang digunakan untuk pertukaran data antara server dengan client dalam aplikasi berbasis web. <\/p>\n\n\n\n
                                Dengan mempelajari dasar-dasar JSON, memudahkan Anda untuk membuat website berbasis API sesuai keperluan. Setelah membaca artikel ini seharusnya Anda sudah memahami apa itu JSON, fungsi, syntax hingga cara kerjanya. <\/p>\n","protected":false},"excerpt":{"rendered":"
                                JavaScript Object Notation atau yang sering disingkat dengan sebutan JSON adalah format pertukaran data berbasis text yang digunakan untuk pertukaran data antara server dengan client dalam aplikasi berbasis web. Melalui artikel ini, Anda akan mempelajari banyak hal tentang JSON, mulai dari pengertian, fungsi, contoh Syntax, hingga cara kerjanya. Mari simak informasi selengkapnya.  Apa itu JSON? […]<\/p>\n","protected":false},"author":319,"featured_media":52202,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[7],"tags":[],"class_list":{"0":"post-52197","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","7":"category-web-programming"},"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/posts\/52197","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/users\/319"}],"replies":[{"embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/comments?post=52197"}],"version-history":[{"count":0,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/posts\/52197\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/media\/52202"}],"wp:attachment":[{"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/media?parent=52197"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/categories?post=52197"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/tags?post=52197"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}