JSON, atau Notasi Objek JavaScript, ada di sekitar kita. Jika Anda pernah menggunakan aplikasi web, kemungkinan besar aplikasi tersebut menggunakan JSON untuk menyusun, menyimpan, dan mengirimkan data antara servernya dan perangkat Anda
Pada artikel ini, kita akan membahas secara singkat perbedaan antara JSON dan JavaScript, lalu beralih ke berbagai cara untuk mengurai JSON dengan JavaScript di browser dan di Node. proyek js
Perbedaan antara JSON dan JavaScript
Meskipun JSON terlihat seperti JavaScript biasa, lebih baik menganggap JSON sebagai format data, mirip dengan file teks. Kebetulan JSON terinspirasi oleh sintaks JavaScript, itulah sebabnya mereka terlihat sangat mirip
Mari kita lihat objek JSON dan larik JSON dan bandingkan dengan JavaScript
Objek JSON vs Literal Objek JavaScript
Pertama, inilah objek JSON
{ "name": "Jane Doe", "favorite-game": "Stardew Valley", "subscriber": false } profil jane. jsonPerbedaan utama antara objek JSON dan objek JavaScript biasa – juga disebut literal objek – terletak pada tanda kutip. Semua kunci dan nilai tipe string dalam objek JSON harus dibungkus dengan tanda kutip ganda ([ { "name": "Jane Doe", "favorite-game": "Stardew Valley", "subscriber": false }, { "name": "John Doe", "favorite-game": "Dragon Quest XI", "subscriber": true } ] 9)
Literal objek JavaScript sedikit lebih fleksibel. Dengan literal objek, Anda tidak perlu membungkus kunci dan string dalam tanda kutip ganda. Sebaliknya, Anda dapat menggunakan tanda kutip tunggal (const profiles = [ { name: 'Jane Doe', 'favorite-game': 'Stardew Valley', subscriber: false }, { name: 'John Doe', 'favorite-game': 'Dragon Quest XI', subscriber: true } ]; 0), atau tidak menggunakan jenis tanda kutip apa pun untuk kunci
Berikut adalah tampilan kode di atas sebagai literal objek JavaScript
const profile = { name: 'Jane Doe', 'favorite-game': 'Stardew Valley', subscriber: false }Perhatikan bahwa kunci const profiles = [ { name: 'Jane Doe', 'favorite-game': 'Stardew Valley', subscriber: false }, { name: 'John Doe', 'favorite-game': 'Dragon Quest XI', subscriber: true } ]; _1 dibungkus dengan tanda kutip tunggal. Dengan literal objek, Anda harus membungkus kunci di mana kata dipisahkan dengan tanda hubung (const profiles = [ { name: 'Jane Doe', 'favorite-game': 'Stardew Valley', subscriber: false }, { name: 'John Doe', 'favorite-game': 'Dragon Quest XI', subscriber: true } ]; 2) dalam tanda kutip
Jika Anda ingin menghindari tanda kutip, Anda dapat menulis ulang kunci untuk menggunakan huruf besar kecil (const profiles = [ { name: 'Jane Doe', 'favorite-game': 'Stardew Valley', subscriber: false }, { name: 'John Doe', 'favorite-game': 'Dragon Quest XI', subscriber: true } ]; 3) atau memisahkan kata dengan garis bawah (const profiles = [ { name: 'Jane Doe', 'favorite-game': 'Stardew Valley', subscriber: false }, { name: 'John Doe', 'favorite-game': 'Dragon Quest XI', subscriber: true } ]; 4) sebagai gantinya
Array JSON vs array JavaScript
Array JSON bekerja hampir sama dengan array di JavaScript, dan dapat berisi string, boolean, angka, dan objek JSON lainnya. Misalnya
[ { "name": "Jane Doe", "favorite-game": "Stardew Valley", "subscriber": false }, { "name": "John Doe", "favorite-game": "Dragon Quest XI", "subscriber": true } ] _profil. jsonInilah tampilannya di JavaScript biasa
const profiles = [ { name: 'Jane Doe', 'favorite-game': 'Stardew Valley', subscriber: false }, { name: 'John Doe', 'favorite-game': 'Dragon Quest XI', subscriber: true } ];JSON sebagai string
Anda mungkin bertanya-tanya, jika ada objek dan array JSON, tidak bisakah Anda menggunakannya dalam program Anda seperti literal atau array objek JavaScript biasa?
Alasan mengapa Anda tidak dapat melakukan ini adalah karena JSON sebenarnya hanyalah sebuah string
Misalnya, ketika Anda menulis JSON dalam file terpisah seperti dengan const profiles = [ { name: 'Jane Doe', 'favorite-game': 'Stardew Valley', subscriber: false }, { name: 'John Doe', 'favorite-game': 'Dragon Quest XI', subscriber: true } ]; 5 atau const profiles = [ { name: 'Jane Doe', 'favorite-game': 'Stardew Valley', subscriber: false }, { name: 'John Doe', 'favorite-game': 'Dragon Quest XI', subscriber: true } ]; 6 di atas, file tersebut sebenarnya berisi teks dalam bentuk objek atau larik JSON, yang kebetulan terlihat seperti JavaScript
Dan jika Anda membuat permintaan ke API, itu akan mengembalikan sesuatu seperti ini
{"name":"Jane Doe","favorite-game":"Stardew Valley","subscriber":false}Sama seperti file teks, jika Anda ingin menggunakan JSON dalam proyek Anda, Anda harus mengurai atau mengubahnya menjadi sesuatu yang dapat dipahami oleh bahasa pemrograman Anda. Misalnya, mem-parsing objek JSON dengan Python akan membuat kamus
Dengan pemahaman itu, mari kita lihat berbagai cara untuk mengurai JSON dalam JavaScript
Cara mengurai JSON di browser
Jika Anda bekerja dengan JSON di browser, Anda mungkin menerima atau mengirim data melalui API
Mari kita lihat beberapa contoh
Cara mengurai JSON dengan const profiles = [ { name: 'Jane Doe', 'favorite-game': 'Stardew Valley', subscriber: false }, { name: 'John Doe', 'favorite-game': 'Dragon Quest XI', subscriber: true } ]; _7
Cara termudah untuk mendapatkan data dari API adalah dengan const profiles = [ { name: 'Jane Doe', 'favorite-game': 'Stardew Valley', subscriber: false }, { name: 'John Doe', 'favorite-game': 'Dragon Quest XI', subscriber: true } ]; 7, yang menyertakan metode const profiles = [ { name: 'Jane Doe', 'favorite-game': 'Stardew Valley', subscriber: false }, { name: 'John Doe', 'favorite-game': 'Dragon Quest XI', subscriber: true } ]; 9 untuk mengurai respons JSON menjadi literal atau larik objek JavaScript yang dapat digunakan secara otomatis
Berikut beberapa kode yang menggunakan const profiles = [ { name: 'Jane Doe', 'favorite-game': 'Stardew Valley', subscriber: false }, { name: 'John Doe', 'favorite-game': 'Dragon Quest XI', subscriber: true } ]; _7 untuk membuat permintaan {"name":"Jane Doe","favorite-game":"Stardew Valley","subscriber":false}1 untuk lelucon bertema pengembang dari Chuck Norris Jokes API gratis
fetch('//api.chucknorris.io/jokes/random?category=dev') .then(res => res.json()) // the .json() method parses the JSON response into a JS object literal .then(data => console.log(data));Jika Anda menjalankan kode itu di browser, Anda akan melihat sesuatu seperti ini masuk ke konsol
{ "categories": ["dev"], "created_at": "2020-01-05 13:42:19.324003", "icon_url": "//assets.chucknorris.host/img/avatar/chuck-norris.png", "id": "elgv2wkvt8ioag6xywykbq", "updated_at": "2020-01-05 13:42:19.324003", "url": "//api.chucknorris.io/jokes/elgv2wkvt8ioag6xywykbq", "value": "Chuck Norris's keyboard doesn't have a Ctrl key because nothing controls Chuck Norris." }Meskipun terlihat seperti objek JSON, sebenarnya ini adalah literal objek JavaScript, dan Anda dapat menggunakannya secara bebas di program Anda
Cara merangkai JSON dengan {"name":"Jane Doe","favorite-game":"Stardew Valley","subscriber":false}2
Tetapi bagaimana jika Anda ingin mengirim data ke API?
Misalnya, Anda ingin mengirimkan lelucon Chuck Norris ke API Lelucon Chuck Norris agar orang lain dapat membacanya nanti
Pertama, Anda akan menulis lelucon Anda sebagai objek JS literal
const newJoke = { categories: ['dev'], value: "Chuck Norris's keyboard is made up entirely of Cmd keys because Chuck Norris is always in command." };Kemudian, karena Anda mengirim data ke API, Anda harus mengubah literal objek {"name":"Jane Doe","favorite-game":"Stardew Valley","subscriber":false}3 Anda menjadi string JSON
Untungnya, JavaScript menyertakan metode yang sangat membantu untuk melakukannya – {"name":"Jane Doe","favorite-game":"Stardew Valley","subscriber":false}2
const newJoke = { categories: ['dev'], value: "Chuck Norris's keyboard is made up entirely of Cmd keys because Chuck Norris is always in command." }; console.log(JSON.stringify(newJoke)); // {"categories":["dev"],"value":"Chuck Norris's keyboard is made up entirely of Cmd keys because Chuck Norris is always in command."} console.log(typeof JSON.stringify(newJoke)); // stringSaat kami mengonversi literal objek menjadi string JSON dalam contoh ini, {"name":"Jane Doe","favorite-game":"Stardew Valley","subscriber":false}2 juga berfungsi dengan array
Terakhir, Anda hanya perlu mengirim lelucon bersenar JSON Anda kembali ke API dengan permintaan {"name":"Jane Doe","favorite-game":"Stardew Valley","subscriber":false}6
Perhatikan bahwa Chuck Norris Jokes API sebenarnya tidak memiliki fitur ini. Tetapi jika ya, seperti inilah tampilan kodenya
const newJoke = { categories: ['dev'], value: "Chuck Norris's keyboard is made up entirely of Cmd keys because Chuck Norris is always in command." }; fetch('//api.chucknorris.io/jokes/submit', { // fake API endpoint method: 'POST', headers: { 'Content-Type': 'application/json', }, body: JSON.stringify(newJoke), // turn the JS object literal into a JSON string }) .then(res => res.json()) .then(data => console.log(data)) .catch(err => { console.error(err); });Dan begitu saja, Anda telah mengurai JSON yang masuk dengan const profiles = [ { name: 'Jane Doe', 'favorite-game': 'Stardew Valley', subscriber: false }, { name: 'John Doe', 'favorite-game': 'Dragon Quest XI', subscriber: true } ]; 7 dan menggunakan {"name":"Jane Doe","favorite-game":"Stardew Valley","subscriber":false}2 untuk mengubah literal objek JS menjadi string JSON
Cara bekerja dengan file JSON lokal di browser
Sayangnya, tidak mungkin (atau disarankan) memuat file JSON lokal di browser
const profiles = [ { name: 'Jane Doe', 'favorite-game': 'Stardew Valley', subscriber: false }, { name: 'John Doe', 'favorite-game': 'Dragon Quest XI', subscriber: true } ]; 7 akan menimbulkan kesalahan jika Anda mencoba memuat file lokal. Misalnya, Anda memiliki file JSON dengan beberapa lelucon
const profile = { name: 'Jane Doe', 'favorite-game': 'Stardew Valley', subscriber: false } 0lelucon. jsonDan Anda ingin menguraikannya dan membuat daftar lelucon di halaman HTML sederhana
Jika Anda membuat halaman dengan yang berikut dan membukanya di browser Anda
const profile = { name: 'Jane Doe', 'favorite-game': 'Stardew Valley', subscriber: false } 1indeks. htmlAnda akan melihat ini di konsol
const profile = { name: 'Jane Doe', 'favorite-game': 'Stardew Valley', subscriber: false } 2Secara default, browser tidak mengizinkan akses ke file lokal untuk alasan keamanan. Ini adalah hal yang baik, dan Anda tidak boleh mencoba mengatasi perilaku ini
Sebagai gantinya, hal terbaik untuk dilakukan adalah mengonversi file JSON lokal menjadi JavaScript. Untungnya, ini cukup mudah karena sintaks JSON sangat mirip dengan JavaScript
Yang perlu Anda lakukan hanyalah membuat file baru dan mendeklarasikan JSON Anda sebagai variabel
const profile = { name: 'Jane Doe', 'favorite-game': 'Stardew Valley', subscriber: false } 3lelucon. jsDan tambahkan ke halaman Anda sebagai skrip terpisah
const profile = { name: 'Jane Doe', 'favorite-game': 'Stardew Valley', subscriber: false } _4Anda akan dapat menggunakan larik fetch('//api.chucknorris.io/jokes/random?category=dev') .then(res => res.json()) // the .json() method parses the JSON response into a JS object literal .then(data => console.log(data)); 0 secara bebas dalam kode Anda
Anda juga dapat menggunakan JavaScript fetch('//api.chucknorris.io/jokes/random?category=dev') .then(res => res.json()) // the .json() method parses the JSON response into a JS object literal .then(data => console.log(data)); _1 untuk melakukan hal yang sama, tetapi itu sedikit di luar cakupan artikel ini
Tetapi bagaimana jika Anda ingin bekerja dengan file JSON lokal dan memiliki Node. js diinstal?
Cara mengurai JSON di Node. js
Node. js adalah runtime JavaScript yang memungkinkan Anda menjalankan JavaScript di luar browser. Anda dapat membaca semua tentang Node. js di sini
Apakah Anda menggunakan Node. js untuk menjalankan kode secara lokal di komputer Anda, atau untuk menjalankan seluruh aplikasi web di server, ada baiknya mengetahui cara bekerja dengan JSON
Untuk contoh berikut, kami akan menggunakan file fetch('//api.chucknorris.io/jokes/random?category=dev') .then(res => res.json()) // the .json() method parses the JSON response into a JS object literal .then(data => console.log(data)); 2 yang sama
const profile = { name: 'Jane Doe', 'favorite-game': 'Stardew Valley', subscriber: false } 0lelucon. jsonCara mengurai file JSON dengan fetch('//api.chucknorris.io/jokes/random?category=dev') .then(res => res.json()) // the .json() method parses the JSON response into a JS object literal .then(data => console.log(data)); 3
Mari kita mulai dengan metode termudah
Jika Anda memiliki file JSON lokal, yang perlu Anda lakukan hanyalah menggunakan fetch('//api.chucknorris.io/jokes/random?category=dev') .then(res => res.json()) // the .json() method parses the JSON response into a JS object literal .then(data => console.log(data)); 3 untuk memuatnya seperti Node lainnya. modul js
const profile = { name: 'Jane Doe', 'favorite-game': 'Stardew Valley', subscriber: false } 6File JSON akan diuraikan untuk Anda secara otomatis dan Anda dapat mulai menggunakannya dalam proyek Anda
const profile = { name: 'Jane Doe', 'favorite-game': 'Stardew Valley', subscriber: false } _7Perhatikan bahwa ini sinkron, artinya program Anda akan berhenti hingga mem-parsing seluruh file sebelum melanjutkan. File JSON yang sangat besar dapat menyebabkan program Anda melambat, jadi berhati-hatilah dengan itu
Juga, karena mem-parsing JSON dengan cara ini memuat semuanya ke dalam memori, lebih baik menggunakan metode ini untuk file JSON statis. Jika file JSON berubah saat program Anda berjalan, Anda tidak akan memiliki akses ke perubahan tersebut hingga Anda memulai ulang program dan mengurai file JSON yang diperbarui
Cara mengurai file JSON dengan fetch('//api.chucknorris.io/jokes/random?category=dev') .then(res => res.json()) // the .json() method parses the JSON response into a JS object literal .then(data => console.log(data)); 5) dan fetch('//api.chucknorris.io/jokes/random?category=dev') .then(res => res.json()) // the .json() method parses the JSON response into a JS object literal .then(data => console.log(data)); 6
Ini adalah cara yang lebih tradisional (karena tidak ada istilah yang lebih baik) untuk mengurai file JSON di Node. Proyek js – baca file dengan modul fetch('//api.chucknorris.io/jokes/random?category=dev') .then(res => res.json()) // the .json() method parses the JSON response into a JS object literal .then(data => console.log(data)); 7 (sistem file), lalu parsing dengan fetch('//api.chucknorris.io/jokes/random?category=dev') .then(res => res.json()) // the .json() method parses the JSON response into a JS object literal .then(data => console.log(data)); 6
Mari kita lihat bagaimana melakukannya dengan metode ________18______9. Pertama, tambahkan modul fetch('//api.chucknorris.io/jokes/random?category=dev') .then(res => res.json()) // the .json() method parses the JSON response into a JS object literal .then(data => console.log(data)); _7 ke proyek Anda
const profile = { name: 'Jane Doe', 'favorite-game': 'Stardew Valley', subscriber: false } 8Kemudian, buat variabel baru untuk menyimpan output dari file fetch('//api.chucknorris.io/jokes/random?category=dev') .then(res => res.json()) // the .json() method parses the JSON response into a JS object literal .then(data => console.log(data)); 2 dan atur sama dengan fetch('//api.chucknorris.io/jokes/random?category=dev') .then(res => res.json()) // the .json() method parses the JSON response into a JS object literal .then(data => console.log(data)); 9
fetch('//api.chucknorris.io/jokes/random?category=dev') .then(res => res.json()) // the .json() method parses the JSON response into a JS object literal .then(data => console.log(data)); _9 mengambil beberapa argumen. Yang pertama adalah jalur ke file yang ingin Anda baca
[ { "name": "Jane Doe", "favorite-game": "Stardew Valley", "subscriber": false }, { "name": "John Doe", "favorite-game": "Dragon Quest XI", "subscriber": true } ] _0Tetapi jika Anda memasukkan { "categories": ["dev"], "created_at": "2020-01-05 13:42:19.324003", "icon_url": "//assets.chucknorris.host/img/avatar/chuck-norris.png", "id": "elgv2wkvt8ioag6xywykbq", "updated_at": "2020-01-05 13:42:19.324003", "url": "//api.chucknorris.io/jokes/elgv2wkvt8ioag6xywykbq", "value": "Chuck Norris's keyboard doesn't have a Ctrl key because nothing controls Chuck Norris." } 4 ke konsol sekarang, Anda akan melihat sesuatu seperti ini
[ { "name": "Jane Doe", "favorite-game": "Stardew Valley", "subscriber": false }, { "name": "John Doe", "favorite-game": "Dragon Quest XI", "subscriber": true } ] _1Itu hanya berarti bahwa modul fetch('//api.chucknorris.io/jokes/random?category=dev') .then(res => res.json()) // the .json() method parses the JSON response into a JS object literal .then(data => console.log(data)); _7 sedang membaca file, tetapi tidak mengetahui pengkodean atau format file tersebut. fetch('//api.chucknorris.io/jokes/random?category=dev') .then(res => res.json()) // the .json() method parses the JSON response into a JS object literal .then(data => console.log(data)); _7 dapat digunakan untuk memuat hampir semua file, dan bukan hanya yang berbasis teks seperti JSON, jadi kita perlu memberi tahu cara file dikodekan
Untuk file berbasis teks, penyandian biasanya { "categories": ["dev"], "created_at": "2020-01-05 13:42:19.324003", "icon_url": "//assets.chucknorris.host/img/avatar/chuck-norris.png", "id": "elgv2wkvt8ioag6xywykbq", "updated_at": "2020-01-05 13:42:19.324003", "url": "//api.chucknorris.io/jokes/elgv2wkvt8ioag6xywykbq", "value": "Chuck Norris's keyboard doesn't have a Ctrl key because nothing controls Chuck Norris." } 7
[ { "name": "Jane Doe", "favorite-game": "Stardew Valley", "subscriber": false }, { "name": "John Doe", "favorite-game": "Dragon Quest XI", "subscriber": true } ] _2Sekarang jika Anda masuk { "categories": ["dev"], "created_at": "2020-01-05 13:42:19.324003", "icon_url": "//assets.chucknorris.host/img/avatar/chuck-norris.png", "id": "elgv2wkvt8ioag6xywykbq", "updated_at": "2020-01-05 13:42:19.324003", "url": "//api.chucknorris.io/jokes/elgv2wkvt8ioag6xywykbq", "value": "Chuck Norris's keyboard doesn't have a Ctrl key because nothing controls Chuck Norris." } _4 ke konsol, Anda akan melihat konten file
Namun sejauh ini kami hanya membaca file, dan itu masih berupa string. Kita harus menggunakan metode lain untuk mengurai { "categories": ["dev"], "created_at": "2020-01-05 13:42:19.324003", "icon_url": "//assets.chucknorris.host/img/avatar/chuck-norris.png", "id": "elgv2wkvt8ioag6xywykbq", "updated_at": "2020-01-05 13:42:19.324003", "url": "//api.chucknorris.io/jokes/elgv2wkvt8ioag6xywykbq", "value": "Chuck Norris's keyboard doesn't have a Ctrl key because nothing controls Chuck Norris." } 4 menjadi objek atau larik JavaScript yang dapat digunakan
Untuk melakukannya, kita akan menggunakan fetch('//api.chucknorris.io/jokes/random?category=dev') .then(res => res.json()) // the .json() method parses the JSON response into a JS object literal .then(data => console.log(data)); 6
[ { "name": "Jane Doe", "favorite-game": "Stardew Valley", "subscriber": false }, { "name": "John Doe", "favorite-game": "Dragon Quest XI", "subscriber": true } ] _3Seperti namanya, fetch('//api.chucknorris.io/jokes/random?category=dev') .then(res => res.json()) // the .json() method parses the JSON response into a JS object literal .then(data => console.log(data)); _6 mengambil string JSON dan mem-parsingnya menjadi literal atau larik objek JavaScript
Seperti dengan metode const newJoke = { categories: ['dev'], value: "Chuck Norris's keyboard is made up entirely of Cmd keys because Chuck Norris is always in command." }; _2 di atas, fetch('//api.chucknorris.io/jokes/random?category=dev') .then(res => res.json()) // the .json() method parses the JSON response into a JS object literal .then(data => console.log(data)); 9 adalah metode sinkron, artinya dapat menyebabkan program Anda melambat jika membaca file besar, JSON atau lainnya
Juga, itu hanya membaca file sekali dan memuatnya ke dalam memori. Jika file berubah, Anda harus membaca file lagi di beberapa titik. Untuk mempermudah, Anda mungkin ingin membuat fungsi sederhana untuk membaca file
Inilah tampilannya
[ { "name": "Jane Doe", "favorite-game": "Stardew Valley", "subscriber": false }, { "name": "John Doe", "favorite-game": "Dragon Quest XI", "subscriber": true } ] _4Cara mengurai JSON dengan const newJoke = { categories: ['dev'], value: "Chuck Norris's keyboard is made up entirely of Cmd keys because Chuck Norris is always in command." }; 4) dan fetch('//api.chucknorris.io/jokes/random?category=dev') .then(res => res.json()) // the .json() method parses the JSON response into a JS object literal .then(data => console.log(data)); 6
Metode const newJoke = { categories: ['dev'], value: "Chuck Norris's keyboard is made up entirely of Cmd keys because Chuck Norris is always in command." }; _6 sangat mirip dengan fetch('//api.chucknorris.io/jokes/random?category=dev') .then(res => res.json()) // the .json() method parses the JSON response into a JS object literal .then(data => console.log(data)); 9, kecuali metode ini bekerja secara asinkron. Ini bagus jika Anda memiliki file besar untuk dibaca dan Anda tidak ingin menyimpan sisa kode Anda
Ini contoh dasarnya
[ { "name": "Jane Doe", "favorite-game": "Stardew Valley", "subscriber": false }, { "name": "John Doe", "favorite-game": "Dragon Quest XI", "subscriber": true } ] _5Sejauh ini terlihat mirip dengan apa yang kita lakukan dengan fetch('//api.chucknorris.io/jokes/random?category=dev') .then(res => res.json()) // the .json() method parses the JSON response into a JS object literal .then(data => console.log(data)); 9, kecuali kita tidak menugaskannya ke variabel seperti { "categories": ["dev"], "created_at": "2020-01-05 13:42:19.324003", "icon_url": "//assets.chucknorris.host/img/avatar/chuck-norris.png", "id": "elgv2wkvt8ioag6xywykbq", "updated_at": "2020-01-05 13:42:19.324003", "url": "//api.chucknorris.io/jokes/elgv2wkvt8ioag6xywykbq", "value": "Chuck Norris's keyboard doesn't have a Ctrl key because nothing controls Chuck Norris." } 4. Karena asinkron, kode apa pun setelah const newJoke = { categories: ['dev'], value: "Chuck Norris's keyboard is made up entirely of Cmd keys because Chuck Norris is always in command." }; 6 akan berjalan sebelum selesai membaca file
Sebagai gantinya, kami akan menggunakan fungsi callback dan mengurai JSON di dalamnya
[ { "name": "Jane Doe", "favorite-game": "Stardew Valley", "subscriber": false }, { "name": "John Doe", "favorite-game": "Dragon Quest XI", "subscriber": true } ] _6Yang mencetak berikut ke konsol
[ { "name": "Jane Doe", "favorite-game": "Stardew Valley", "subscriber": false }, { "name": "John Doe", "favorite-game": "Dragon Quest XI", "subscriber": true } ] _7Seperti dengan fetch('//api.chucknorris.io/jokes/random?category=dev') .then(res => res.json()) // the .json() method parses the JSON response into a JS object literal .then(data => console.log(data)); _9, const newJoke = { categories: ['dev'], value: "Chuck Norris's keyboard is made up entirely of Cmd keys because Chuck Norris is always in command." }; 6 memuat file ke dalam memori, artinya Anda harus membaca file itu lagi jika ada perubahan
Juga, meskipun const newJoke = { categories: ['dev'], value: "Chuck Norris's keyboard is made up entirely of Cmd keys because Chuck Norris is always in command." }; _6 asinkron, pada akhirnya memuat seluruh file yang sedang dibaca ke dalam memori. Jika Anda memiliki file besar, mungkin lebih baik untuk melihat Node. js streaming sebagai gantinya
Cara merangkai JSON dengan {"name":"Jane Doe","favorite-game":"Stardew Valley","subscriber":false}2 di Node. js
Terakhir, jika Anda mem-parsing JSON dengan Node. js, ada kemungkinan besar Anda perlu mengembalikan JSON di beberapa titik, mungkin sebagai respons API
Untungnya, ini bekerja dengan cara yang sama seperti di browser – cukup gunakan {"name":"Jane Doe","favorite-game":"Stardew Valley","subscriber":false}2 untuk mengonversi literal atau larik objek JavaScript menjadi string JSON
[ { "name": "Jane Doe", "favorite-game": "Stardew Valley", "subscriber": false }, { "name": "John Doe", "favorite-game": "Dragon Quest XI", "subscriber": true } ] _8Dan itu saja. Kami telah membahas hampir semua hal yang perlu Anda ketahui tentang bekerja dengan JSON di browser dan di Node. proyek js
Sekarang keluarlah dan parsing atau string JSON ke isi hati Anda
Apakah saya melewatkan sesuatu?
IKLAN
IKLAN
IKLAN
IKLAN
IKLAN
IKLAN
IKLAN
IKLAN
IKLAN
IKLAN
IKLAN
IKLAN
IKLAN
Baca lebih banyak posting
Jika Anda membaca sejauh ini, tweet ke penulis untuk menunjukkan bahwa Anda peduli. Tweet terima kasih
Belajar kode secara gratis. Kurikulum open source freeCodeCamp telah membantu lebih dari 40.000 orang mendapatkan pekerjaan sebagai pengembang. Memulai