JSON Ağacı
JSON'u tür rozetleri, JSON Pointer yolları ve arama ile katlanabilir ağaç olarak keşfedin
JSON
Ağaç
Sola JSON yapıştırın ve keşfetmek için Ağacı Oluştur'a basın.
JSON Ağacı
JSON'u tür rozetleri, JSON Pointer yolları ve arama ile katlanabilir ağaç olarak keşfedin
Özellikler
- Özyinelemeli katlanabilir ağaç: her nesne ve dizi düğümünün kendi genişlet/daralt geçişi vardır; yapı hemen görünür olacak şekilde kök varsayılan olarak genişletilir
- Düğüm başına JSON Pointer (RFC 6901) — tam yolu görmek için herhangi bir anahtarın üzerine gelin, yamalarda, fark/diff veya şema instancePaths'de kullanmak üzere kopyalamak için zincir simgesine tıklayın
- Tür-duyarlı rozetler her düğümü gerçek türüne göre renklendirir (string / number / boolean / null / array / object) — null artık JavaScript'in typeof'u gibi 'object' arkasında saklı değil
- Önizleme sütunu tek satırlık bir özet gösterir: skaler değerler satır içi, diziler eleman sayılarıyla `[ N ]`, nesneler anahtar sayılarıyla `{ N }` olarak — genişletmeden önce boyutu tarayabilirsiniz
- Arama filtresi anahtar adlarını, JSON Pointer yollarını ve önizleme metnini eşleştirir; ağaç yalnızca eşleşme içeren dallara daraltılır, 10 MB belgelerde aramaları yapılabilir kılar
- Değeri kopyala düğmesi düğümün değerini panoya yazar — dizeleri ham metin olarak, karmaşık türleri başka bir araca yapıştırmaya hazır pretty-print JSON olarak
- Ayrıştırma hataları JavaScript motorunun tam mesajını içerir (genellikle satır/sütun bilgisiyle), böylece bozulanın ne olduğunu tahmin etmek yerine girdiyi düzeltebilirsiniz
- Tamamen istemci tarafı: girdi tarayıcıdan ayrılmaz, tüm ağaç bellekte oluşturulur, telemetri yok ve sayfa önbelleğe alındıktan sonra çevrimdışı çalışır
Nasıl Kullanılır
- JSON'u sol metin alanına yapıştırın veya küçük bir örnek için Örnek Yükle'ye tıklayın.
- Ağacı Oluştur'a basın. Kök genişletilmiş gösterilir; aşağı inmek için herhangi bir nesne/dizi düğümünün yanındaki şevrona tıklayın.
- Anahtar adı, değer veya JSON Pointer yoluna göre filtrelemek için arama kutusunu kullanın — yalnızca eşleşen dallar görünür kalır.
- Bir anahtarın üzerine gelerek JSON Pointer yolunu ipucu olarak görün; kopyalamak için zincir simgesine tıklayın.
- Düğümün değerini almak için kopya simgesine tıklayın — skalerler ham olarak, nesneler/diziler pretty-print JSON olarak kopyalanır.
- Tüm ağacı bir kerede çevirmek için Tümünü genişlet / Tümünü daralt kullanın.
İpuçları ve En İyi Uygulamalar
- Bir geçişe tıklarken Shift basılı tutarak tüm dalları daha hızlı katlayın/açın — işletim sistemi kısayolu eşlendiğinde, geçiş düğmesi yine de bireysel olarak çalışır.
- Hata ayıklarken değeri arayın (yalnızca anahtarı değil) — önizleme metni eşleşmeye dahildir.
- Buradan bir JSON Pointer kopyalayın ve doğrulamayı bozan tam düğümü onaylamak için JSON Schema Doğrulayıcı'nın hata raporuna yapıştırın.
- Ağaç yavaş hissettirirse önce en büyük diziyi daraltın — uzun diziler render maliyetini domine eder.
- JSON Diff ile eşleştirin: kesin düğüm düzeyinde düzenlemeyi görmek için değişiklikten önce/sonra bir değer kopyalayın.
SSS
JSON Pointer nedir ve nasıl kullanılır?
JSON Pointer (RFC 6901), bir JSON belgesinde tam olarak bir düğümü adlandıran eğik-çizgi ayrımlı bir yoldur: `/owner/name` owner nesnesinin name alanıdır; `/tags/1` tags dizisinin ikinci elemanıdır. Kök boş dizedir (burada `/` olarak gösterilir). Bu araç JSON Schema instancePath hataları ve fast-json-patch gibi araçlarla aynı biçimi kullanır, böylece buradan bir pointer kopyalayıp başka yerde doğrudan referans olarak kullanabilirsiniz.
Tür rozeti JavaScript'in typeof'undan nasıl farklı?
İki şekilde. Birincisi, null 'null' olarak görünür (JavaScript'te typeof null === 'object' — uzun süredir tartışılan bir kusur). İkincisi, diziler typeof'un 'object'i yerine 'array' olarak görünür çünkü farklı render edilir ve davranır. Bu, JSON spec'inin altı değer türüne uyar: string, number, boolean, null, array, object.
Arama nasıl çalışır?
Sorgu büyük-küçük harf duyarsız olarak düğümün anahtarına, JSON Pointer yoluna ve önizleme dizesine eşleştirilir. Kendisi veya herhangi bir alt düğümü eşleştiyse dal görünür kalır — böylece derin iç içe bir değeri arayabilir ve yine de ona giden anahtarları görebilirsiniz. Tam ağacı geri getirmek için kutuyu temizleyin.
Çok büyük JSON ile baş edebilir mi?
Tüm ağacı bir kez bellekte oluşturur, dolayısıyla megabayt ölçekli belgeler rahatça render edilir. Yüz megabaytlık JSON düşük RAM'li telefonlarda sıkışık olabilir; bu aralık için akış araçlarını tercih edin veya önce boşlukları atmak için JSON Minify çalıştırın. Render sanallaştırılmamış — her görünür düğüm bir DOM öğesine render edilir — bu yüzden takılırsa büyük dalları daraltmak hilesidir.
Bir düğümü daraltmak verisini kaybeder mi?
Hayır. Daraltma tamamen görseldir — temel ayrıştırılmış nesne bellekte kalır, böylece yeniden genişletme aynı içeriği anında gösterir. Arama daraltma durumunu yok sayar ve daraltılmış düğümler içindeki eşleşmeleri ortaya çıkarır.
Önizleme neden boş bir nesne için `{ 0 }` gösteriyor?
Süslü parantezler içindeki sayı nesneler için anahtar sayısı, diziler için uzunluktur. Sıfır anahtarlı nesneler ve sıfır uzunluklu diziler geçerli JSON'dur ve aynı değer değildir (`{}` vs `[]`), bu nedenle sayıyı ve parantezleri göstermek hem türü hem de boyutu bir bakışta açıklar.
JSON Formatter'daki ağaç görünümünden farkı nedir?
JSON Formatter'ın ağacı birçok sekmeden biridir (pretty-print, JSONPath, şema doğrulama, dönüşümler, diff ile birlikte). Bu araç bağımsız yalnız-ağaç görünümüdür: bir URL, bir iş, düğüm başına daha derin etkileşim (tür rozetleri, düğüm başına pointer kopyalama, düğüm başına değer kopyalama) — biçimlendirme/dönüşüm/doğrulama yüzey alanı olmadan.
Sunucuya bir şey gönderiliyor mu?
Hayır. JSON tarayıcınızda kalır, ayrıştırma ve ağaç oluşturma sayfayı render eden aynı JavaScript bağlamında senkron olarak çalışır ve Ağacı Oluştur'a bastığınızda Ağ sekmesi hiçbir istek göstermez. İlk yüklemeden sonra sayfa çevrimdışı çalışır.