Yeni bir sıfırdan ileriye Javascript konusuna hoş geldiniz. Bugünkü konumuz Json.
Json Nedir ?
Json aslında verileri geçici olarak saklamamıza sağlayan ve bu verileri istediğimiz zaman bize getiren bir format diyebiliriz. Örneğin bir proje düşünün input alanına ülke adı giriyoruz ve bu ülke adından bize bayrak, nüfus, konuştuğu diller gibi verileri bize gösteriyor. Biz bu ülke verilerine ulaşmak için önce input alanındaki değerin jsonda olup olmadığını kontrol ediyoruz. Eğer varsa o oradaki parametrelere bağlı olarak (ulke.dil,ulke.nufus,ulke.bayrak,vs.) verileri kullanıcıya gösteriyoruz.
Bu tarz projelerde hazır API'ler olur. Bunları json formatını dönüştürüp kullanırız genelde ama bazen json'u kendi elimizle de yazmamız gerektiği durumlar olabiliyor. Artık Json'un iyi kötü ne olduğunu biliyoruz şimdi uygulanışa geçelim.
İlk olarak normal dosya oluşturur gibi dosyaya ad verip uzantıya .json yazarak dosyayı json türüne çeviriyoruz. Bu dosyanın içine iki tırnak parantezi içinde sanki dizi tanımlar gibi tanımlamalar yapıyoruz.
JSON:
{
"kullanici":[
{
"ad":"Dark",
"soyad":"S0ldier",
"yas":100,
"email":"[email protected]"
},
{
"ad":"Darkiki",
"soyad":"S0ldieriki",
"yas":200,
"email":"[email protected]"
},
{
"ad":"dakuc",
"lastName":"S0ldieruc",
"age":300,
"email":"[email protected]"
}
]
}
Aslında uzaktan bakınca obje nesne türüne çok benziyor. Zaten biz bu json dosyasını Javascripte saf olarak kullanamayız. Bunun yerine bu Json'u obje türüne çevirip kullanacağız.
Normalde API kullanırken link + bize verilen key değerlerini kullanarak objeyi çeviririz ama şuan buna ihtiyaç yok bunun yerine yerel bir json kullanıp onu objeye çevireceğiz
JavaScript:
let kullaniciVeri = '{
"kullanici":[
{
"ad":"Dark",
"soyad":"S0ldier",
"yas":100,
"email":"[email protected]"
},
{
"ad":"Darkiki",
"soyad":"S0ldieriki",
"yas":200,
"email":"[email protected]"
},
{
"ad":"dakuc",
"lastName":"S0ldieruc",
"age":300,
"email":"[email protected]"
}
]
}'
const obje = JSON.parse(kullaniciVeri)
console.log(obje)
Böylece Json tipini objeye çevirdik. Şimdi tam tersini yapalım.
JavaScript:
let kullaniciVeri {
Dark : {
email : '[email protected]',
yetenekler: ['Html,Css,Javascript'],
yas : 100,
},
Darkiki : {
email : '[email protected]',
yetenekler: ['Html,Css'],
yas : 200,
},
Darkuc : {
email : '[email protected]',
yetenekler: ['Html'],
yas : 300,
}
}
const jsonYap = JSON.stringify(kullaniciVeri, undefined, 4)
console.log(jsonYap)
Artık objemiz bir Json. Merak ettiğinizin farkındayım tamam stringify ile işlem yapıyoruz ama undefined dediğimiz kısım nedir ?
Aslında bu kısıma undifined yazmak zorunlu değil direkt kendi değişkenimizi de yazabiliriz ama bazı zamanlar filtrelememiz gerekiyor. Bu undifined yerine filtrelenecek öğeleri yazıyoruz. Şimdi buna bir göz atalım.
JavaScript:
const kullanici = {
ad: 'dark',
soyad: 's0ldier',
ulke: 'Turkiye',
email: '[email protected]',
yetenekler: ['HTML', 'CSS', 'JavaScript'],
yas: 100,
aktiflik : 'online'
}
const yazdir = JSON.stringify(kullanici,['ad', 'soyad', 'ulke', 'email', 'yas'],4)
console.log(yazdir)
Böylece filtrelediğimiz ögeler konsola geldi. Mesela aktiflik durumunu filtrelemedim bu yüzden aktiflik durumu konsola gelmedi. Ek olarak kodlarda 4 parametresini kullandık bu boşluk anlamına geliyor kısaca koymasanız da olur sadece görüntü daha hoş durması için koydum
Json temelde bu kadardır. Zor bir konu değil ve zaman zaman kullandığımız bir şeydir. Okuduğunuz için teşekkür ederim başka bir konuda görüşmek üzere.
