By Alligator and Haley Mills
Pengantar
Objek JSON, yang tersedia di semua peramban modern, memiliki dua metode berguna untuk menangani konten yang berformat JSON: parse dan stringify. JSON.parse() mengambil string JSON dan mengubahnya menjadi objek JavaScript. JSON.stringify() mengambil objek JavaScript dan mengubahnya menjadi string JSON.
Berikut adalah contohnya:
const myObj = {
name: 'Skip',
age: 2,
favoriteFood: 'Steak'
};
const myObjStr = JSON.stringify(myObj);
console.log(myObjStr);
// "{"name":"Sammy","age":6,"favoriteFood":"Tofu"}"
console.log(JSON.parse(myObjStr));
// Object {name:"Sammy",age:6,favoriteFood:"Tofu"}
Meskipun metode itu biasanya digunakan pada objek, tetapi dapat juga digunakan pada larik:
const myArr = ['bacon', 'lettuce', 'tomatoes'];
const myArrStr = JSON.stringify(myArr);
console.log(myArrStr);
// "["shark","fish","dolphin"]"
console.log(JSON.parse(myArrStr));
// ["shark","fish","dolphin"]
JSON.parse()
JSON.parse()JSON.parse() dapat mengambil fungsi sebagai argumen kedua yang dapat mengubah nilai objek sebelum mengembalikannya. Di sini, nilai-nilai objek diubah menjadi huruf besar dalam objek yang dikembalikan dari metode parse:
const user = {
name: 'Sammy',
email: 'Sammy@domain.com',
plan: 'Pro'
};
const userStr = JSON.stringify(user);
JSON.parse(userStr, (key, value) => {
if (typeof value === 'string') {
return value.toUpperCase();
}
return value;
});
Catatan: Koma di akhir tidak valid di JSON, jadi JSON.parse() menghasilkan pesan kesalahan jika string yang diberikan padanya memiliki koma di akhir.
JSON.stringify()
JSON.stringify()JSON.stringify() dapat mengambil dua argumen tambahan, yang pertama menjadi fungsi replacer dan yang kedua menjadi nilai String atau Number yang digunakan sebagai space dalam string yang dikembalikan.
Fungsi replacer dapat digunakan untuk menyaring nilai, karena nilai yang dikembalikan sebagai undefined akan dikeluarkan dari string yang dikembalikan:
const user = {
id: 229,
name: 'Sammy',
email: 'Sammy@domain.com'
};
function replacer(key, value) {
console.log(typeof value);
if (key === 'email') {
return undefined;
}
return value;
}
const userStr = JSON.stringify(user, replacer);
// "{"id":229,"name":"Sammy"}"
Contoh dengan argumen space yang disalurkan:
const user = {
name: 'Sammy',
email: 'Sammy@domain.com',
plan: 'Pro'
};
const userStr = JSON.stringify(user, null, '...');
// "{
// ..."name": "Sammy",
// ..."email": "Sammy@domain.com",
// ..."plan": "Pro"
// }"
Kesimpulan
Dalam tutorial ini, Anda telah mendalami cara menggunakan metode JSON.parse() dan JSON.stringify(). Jika Anda ingin mempelajari lebih lanjut tentang menggunakan JSON di Javascript, lihat tutorial Cara Menggunakan JSON di JavaScript dari kami.
Untuk informasi lebih lanjut tentang pengodean di JavaScript, lihat seri Cara Melakukan Pengodean di JavaScript dari kami, atau lihat halaman topik JavaScript kami untuk latihan dan proyek pemrograman.
Thanks for learning with the DigitalOcean Community. Check out our offerings for compute, storage, networking, and managed databases.
About the author(s)
Alligator.io is a developer-focused resource that offers tutorials and insights on a wide range of modern front-end technologies, including Angular 2+, Vue.js, React, TypeScript, Ionic, and JavaScript.
Still looking for an answer?
This textbox defaults to using Markdown to format your answer.
You can type !ref in this text area to quickly search our full set of tutorials, documentation & marketplace offerings and insert the link!
This work is licensed under a Creative Commons Attribution-NonCommercial- ShareAlike 4.0 International License.
Become a contributor for community
Get paid to write technical tutorials and select a tech-focused charity to receive a matching donation.
DigitalOcean Documentation
Full documentation for every DigitalOcean product.
Resources for startups and SMBs
The Wave has everything you need to know about building a business, from raising funding to marketing your product.
The developer cloud
Scale up as you grow — whether you're running one virtual machine or ten thousand.
Get started for free
Sign up and get $200 in credit for your first 60 days with DigitalOcean.*
*This promotional offer applies to new accounts only.