Merhaba, daha önce C# ile JSON Veri Okumak ve Parse Etmek ve JSON Çıktısı Oluşturmak ve JSON Data Okumak {PHP – MySQL} makalelerini sizlerle paylaşmıştım. Bir arkadaşımızın JSON okuma ve oluşturma işlemlerinin javascript ile nasıl yapıldığını öğrenmek istemesi nedeniyle bu makaleyi yazmaya karar verdim.
Bu makalede Javascript ile JSON Çıktısı Oluşturmak ve JSON Data Okumak konularını ele alacağız.
Öncelikle javascript ile örnek bir JSON çıktısı nasıl oluşturulur? Buna bakalım.
JSON Çıktısı Oluşturmak
stringify() fonksiyonu javascript içerisinde JSON string içeren dataları serialize etmek için kullanılır.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
<!DOCTYPE html> <html> <head> <script type="text/javascript"> var book = { title: "Unutulanlar Dışında Yeni Bir Şey Yok", authors: ["Osman Pamukoğlu" ], edition: 3, year: 2011 }; var jsonText = JSON.stringify(book); document.writeln(jsonText); </script> </head> <body> </body> </html> |
JSON Data Okumak
parse() fonksiyonu javascript içerisinde olan JSON verileri native javascript nesnelerine dönüştürür.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 |
<!DOCTYPE html> <html> <head> <script type="text/javascript"> var book = { title: "Unutulanlar Dışında Yeni Bir Şey Yok", authors: ["Osman Pamukoğlu" ], edition: 3, year: 2011 }; var jsonText = JSON.stringify(book); document.writeln(jsonText); var bookCopy = JSON.parse(jsonText); document.writeln(bookCopy); </script> </head> <body> </body> |
Bonus: jQuery ile JSON veri oluşturmak ve okumak
Yukarıda gördüğünüz yöntemler aslında artık çok sıklıkla kullanılan yöntemler değil. Bu işlemleri jQuery ile yapabileceğiniz gibi farklı javascript kütüphaneleri ile de yapabilirsiniz. Aşağıda bonus olarak jquery ile json veri oluşturmak ve okumak için bir örnek paylaşıyorum.
|
1 2 3 4 5 6 7 8 9 |
$(document).ready(function() { var jsonp = '[{"Lang":"jQuery","ID":"1"},{"Lang":"C#","ID":"2"}]'; var lang = ''; var obj = $.parseJSON(jsonp); $.each(obj, function() { lang += this['Lang'] + "<br/>"; }); $('span').html(lang); }); |
Soru, görüş ve önerilerinizi yorum bölümünden benimle paylaşabilirsiniz. Kolaylıklar dilerim.
