JSON Biçimlendiricisi: JSON'u Çevrimiçi Ücretsiz Güzelleştirin ve Doğrulayın

Q: JSON.parse() ile JSON.stringify() arasındaki fark nedir?

JSON.parse(), bir JSON dizesini JavaScript değerine dönüştürür. JSON.stringify() bunun tersini yaparak bir JavaScript değerini JSON dizesine dönüştürür ve güzel yazdırma için bir girinti bağımsız değişkenini kabul eder. Bu araç, büyük tam sayıları tam olarak koruyabilmesini sağlayan şekilde, dahili olarak bu işlevlerin hiçbirini kullanmaz.

JSON biçimlendirici nedir?

JSON biçimlendirici, JSON (JavaScript Nesne Gösterimi) metnini verilerin kendisini değiştirmeden girintiler ve satır sonları ekleyerek yeniden düzenleyen bir araçtır. JSON, ad/değer çiftleri ve listelerden oluşan, yapılandırılmış verileri depolamak ve göndermek için kullanılan düz metin biçimidir. Programlar genellikle tüm gereksiz boşlukları kaldırarak yer kazanır; bunun sonucunda tek satırlık, yoğun ve insan tarafından okunması zor bir metin oluşur. Beautifier veya pretty printer olarak da adlandırılan biçimlendirici, yapının görünür olması için bu boşlukları tutarlı bir şekilde yeniden ekler. Bu araç, JSON yazılır veya yapıştırılırken otomatik olarak biçimlendirme yapar. Biçimlendir düğmesi yoktur; çıktı her tuş vuruşunda güncellenir. Sıfırlama düğmesi girdiyi temizler, kopyalama düğmesi ise biçimlendirilmiş sonucu kopyalar.

JSON söz dizimi kuralları

JSON, RFC 8259 adlı bir belirtimle tanımlanır. İki kapsayıcı türü vardır:

Nesneler, ad/değer çiftlerini küme parantezleri içinde tutar:

1{"name": "John", "age": 30, "city": "New York"}
2

Diziler, sıralı listeleri köşeli parantezler içinde tutar:

1["apple", "banana", "cherry"]
2

JSON'daki bir değer altı türden biri olmalıdır: dize, sayı, boolean (true veya false), null, nesne ya da dizi.

Birkaç kural, hataların çoğuna neden olur:

Özellik adları çift tırnak içine alınmalıdır. {name: "John"} geçersizdir; {"name": "John"} biçiminde olmalıdır.
Dizelerde tek tırnak değil, çift tırnak kullanılmalıdır.
Bir nesne veya dizideki son öğeden sonra virgül gelemez (sonda virgül bulunmamalıdır).
JSON'da, küme ve köşeli parantez görünümü JavaScript'ten gelmesine rağmen yorum söz dizimi yoktur.
JSON'da undefined yoktur. Eksik bir değer için null kullanın.

Yaygın bir hata, JSON yerine bir JavaScript nesne sabitinin yapıştırılmasıdır. {name: 'John', age: undefined} JavaScript'te geçerlidir, ancak JSON'da geçerli değildir. JSON sürümü {"name": "John", "age": null} biçimindedir.

Bu JSON biçimlendirici nasıl çalışır?

Birçok JSON biçimlendirici, metni bir JavaScript nesnesi oluşturmak için JSON.parse() işlevinden geçirir, ardından boşluklandırılmış metne dönüştürmek için JSON.stringify() işlevini çalıştırır. Bu gidiş-dönüş işleminin bir yan etkisi vardır: JavaScript sayıları, 2^53 − 1 değerini (9,007,199,254,740,991) aştıktan sonra her tam sayıyı tam olarak gösteremeyen IEEE 754 çift duyarlıklı kayan noktalı sayılardır. 9007199254740993 gibi bir kimlik, bu gidiş-dönüş işleminden sonra 9007199254740992 olarak çıkabilir.

Bu araç bu adımı atlar. Girdiyi, elle yazılmış küçük bir ayrıştırıcıyla karakter karakter okur ve her sayıyı veya dizeyi bir JavaScript değerine dönüştürmek yerine, metin parçasını yazıldığı biçimiyle aynen kopyalayıp doğru girinti düzeyine yerleştirir. Sayılar hiçbir zaman kayan noktalı sayıya dönüştürülmediği için, her boyuttaki tam sayılar basamaklarını aynen korur. Bir nesnede aynı anahtar iki kez yazılmışsa, JavaScript nesnesi oluşturulurken yapılacağı gibi sonuncusuna indirgenmek yerine her iki kopya da yerinde tutulur.

Süreç adım adım şöyledir:

Sonraki belirteci (nesne, dizi, dize, sayı, true, false veya null) okuyun.
Belirteci JSON dilbilgisine göre denetleyin. Tırnaksız anahtar veya sonda virgül gibi bir kuralı ihlal ediyorsa reddedin.
Belirtecin metnini değiştirmeden çıktıya kopyalayın.
Bir nesne veya dizi içindeki her iç içelik düzeyi için satır sonu ekleyin ve 2 boşluk kadar girinti verin. İçinde hiçbir şey olmayan nesne veya dizi, {} ya da [] gibi tek satırda kalır.
Tüm girdi okunana kadar tekrarlayın.

Girinti 2 boşlukla sabittir; bunu değiştirecek bir ayar yoktur. Girdi kutusu boşken çıktı panelinde "Formatted JSON will appear here automatically..." yer tutucu metni gösterilir. Girdi bir JSON kuralını ihlal ederse araç, karakterin kesin konumunu belirten teknik bir ayrıştırıcı mesajı yerine "Invalid JSON: Please check your input" iletisini gösterir. Buna karşılık tarayıcıların yerleşik JSON.parse() işlevi, hata metninde karakter konumunu bildirir.

Çözümlü örnek

Bu küçültülmüş girdi:

1{"name":"John Doe","age":30,"address":{"street":"123 Main St","city":"Anytown","state":"CA"},"hobbies":["reading","hiking","photography"]}
2

şuna dönüşür:

1{
2  "name": "John Doe",
3  "age": 30,
4  "address": {
5    "street": "123 Main St",
6    "city": "Anytown",
7    "state": "CA"
8  },
9  "hobbies": [
10    "reading",
11    "hiking",
12    "photography"
13  ]
14}
15

Her iç içe nesne veya dizi, üst öğesinden bir düzey daha fazla girintilenir; böylece address ile üç alanı arasındaki ilişki bir bakışta görülür.

İkinci bir örnek, sabitlerin kopyalanmasının neden önemli olduğunu gösterir. Bu girdi:

1{"id":9007199254740993}
2

şu şekilde biçimlendirilir:

1{
2  "id": 9007199254740993
3}
4

Basamaklar yazıldıkları biçimiyle aynen kalır. JSON.parse() ve ardından JSON.stringify() üzerine kurulmuş bir biçimlendirici ise bu sayıyı sessizce 9007199254740992 değerine dönüştürürdü.

Yaygın JSON hataları

Tırnaksız özellik adı: {name: "John"}. Düzeltme: {"name": "John"}.
Sonda virgül: {"age": 30,}. Düzeltme: kapanış küme parantezinden önceki virgülü kaldırın.
Uyumsuz parantezler: {"data": [1, 2}. Düzeltme: nesneyi kapatmadan önce diziyi ] ile kapatın.
Kapatılmamış dize: {"name": "John}. Düzeltme: eksik kapanış tırnağını ekleyin.
Tek tırnaklar: {'name': 'John'}. Düzeltme: çift tırnak kullanın.
undefined, NaN veya Infinity: bunların hiçbiri geçerli JSON değeri değildir. null veya bir dize kullanın.

Bu hataların sık görülen bir kaynağı, bir nesnenin doğrudan tarayıcı konsolundan veya sunucu günlüğünden kopyalanmasıdır; bu kaynaklarda çoğu zaman JSON olarak geçerli olabilmesi için temizlenmesi gereken, yalnızca JavaScript'e özgü söz dizimi bulunur.

JSON biçimlendirici ne zaman kullanılır?

JSON biçimlendiriciler en sık, bant genişliğinden tasarruf etmek için genellikle küçültülmüş olarak gönderilen API yanıtlarını incelemek amacıyla kullanılır. Ayrıca package.json veya composer.json gibi yapılandırma dosyalarını elle denetlemek, bir tarayıcının yerel depolamasından veya konsolundan kopyalanan verileri okumak ve başka bir sistemden alınan veri kümesinin yapısını anlamak için de kullanılır.

JSON biçimlendirmeye yönelik diğer yöntemler

Tarayıcı geliştirici araçları: Chrome, Edge ve Firefox, Ağ sekmesinin önizleme bölmesinde JSON yanıtlarını otomatik olarak biçimlendirir.
Kod düzenleyicileri: Visual Studio Code, açık bir JSON dosyasını Alt+Shift+F (Mac'te Shift+Option+F) ile biçimlendirir. Çoğu düzenleyicide eşdeğer bir kısayol veya biçimlendirme uzantısı bulunur.
Komut satırı: jq (jq . file.json) ve Python'un yerleşik python -m json.tool file.json aracı, JSON'u terminalden biçimlendirir.

JSON biçimlendirmeyi koda ekleme

Çoğu programlama dili, girinti seçeneği içeren bir JSON kitaplığı sağlar. JavaScript'te:

1const formatted = JSON.stringify(JSON.parse(rawJson), null, 2);
2

Python'da:

1import json
2formatted = json.dumps(json.loads(raw_json), indent=2)
3

Her iki yaklaşım da metni yerel bir veri yapısına ayrıştırır ve ardından boşluklandırarak yeniden serileştirir. Yazımı basittir, ancak sayıları değiştirebilir. JavaScript her sayıyı çift duyarlıklı sayı olarak sakladığından, 9007199254740993 değeri 9007199254740992 olarak geri döner. Python, Python tam sayılarının boyut sınırı olmadığı için tam sayıları olduğu gibi korur; ancak yine de 1.0e2 ifadesini 100.0 olarak yeniden yazar ve 1e999 ifadesini geçerli JSON olmayan Infinity değerine dönüştürür. Veritabanı kimlikleri gibi büyük tam sayıların tam doğrulukla korunmasını gerektiren uygulamalar, bunları JSON'da sayı yerine genellikle dize olarak saklar.

JSON'un kısa tarihi

Douglas Crockford, söz dizimini JavaScript nesne sabitlerinden alıp herhangi bir dilden kullanılabilir hâle getirerek JSON'u 2000'li yılların başlarında tanımladı. RFC 4627, JSON'u 2006 yılında resmîleştirdi. XML'den daha kısa yazılabildiği ve doğrudan JavaScript nesnelerine eşlendiği için hızla yayıldı; bu, web uygulamalarının tüm sayfaları yeniden yüklemek yerine arka planda veri almaya başladığı dönemde önem taşıyordu. 2010'lu yıllara gelindiğinde REST API'leri ve MongoDB gibi veritabanları için varsayılan biçim hâline gelmişti.

Sık sorulan sorular

JSON biçimlendirici nedir? Verilerin değiştirilmemesi koşuluyla, yapısının kolay okunabilmesi için JSON metnine girinti, satır sonları ve boşluk ekleyen bir araçtır.

Biçimlendirme verileri değiştirir mi? Hayır. Biçimlendirme yalnızca boşlukları değiştirir. Bu araç, her dizeyi ve sayıyı yazıldığı biçimiyle aynen kopyalar; bu nedenle biçimlendirilmiş çıktının değerleri, JavaScript sayısı olarak tam doğrulukla saklanamayacak kadar büyük sayılar da dâhil olmak üzere, girdideki değerlerle tam olarak aynıdır.

Neden "Invalid JSON" hatası alıyorum? Girdi bir JSON kuralını ihlal ediyor. Yaygın nedenler arasında tırnaksız özellik adları, sonda virgül, tek tırnaklar, kapatılmamış bir dize veya uyumsuz bir parantez bulunur. Bu araç, sorunun kesin karakter konumunu göstermez; girdiyi yukarıda listelenen kurallara göre denetlemek sorunu genellikle hızlıca bulmanızı sağlar.

JSON'da yorum olabilir mi? Hayır. Belirtim bunlara izin vermez. JSONC ve JSON5 gibi biçimler, yapılandırma dosyaları gibi yorumların yararlı olduğu durumlar için JSON söz diziminin üzerine yorum desteği ekler.

Standart JSON girintisi nedir? Web geliştirmede en yaygın kural iki boşluktur ve bu araç da bunu kullanır. Bazı stil kılavuzlarında bunun yerine dört boşluk veya sekme kullanılır; JSON belirtimi belirli bir girinti gerektirmez.

JSON.parse() ile JSON.stringify() arasındaki fark nedir? JSON.parse(), bir JSON dizesini JavaScript değerine dönüştürür. JSON.stringify() bunun tersini yaparak bir JavaScript değerini JSON dizesine dönüştürür ve güzel yazdırma için bir girinti bağımsız değişkenini kabul eder. Bu araç, büyük tam sayıları tam olarak koruyabilmesini sağlayan şekilde, dahili olarak bu işlevlerin hiçbirini kullanmaz.

JSON Biçimlendiricisi: JSON'u Çevrimiçi Ücretsiz Güzelleştirin ve Doğrulayın