JavaScript Biçimlendirici

Bir script'i okuyabileceğiniz biçimde girintileyin, tamamen tarayıcınızda. Yazdığınız hiçbir satır sonu asla silinmez.

Tamamen tarayıcınızda çalışır. Hiçbir şey yüklenmez, günlüğe yazılmaz veya saklanmaz.

Küçültülmüş ya da kötü girintilenmiş bir script yapıştırın ve düzgünce okuyun. Biçimlendirme tarayıcınızda yapılır ve kodda boşlukları dışında hiçbir şey değişmez.

Nasıl çalışır

Script parçalara bölünür (yorumlar, dizeler, şablon dizeleri, regex'ler, sayılar, adlar, operatörler, parantezler ve süslü parantezler) ve ardından yeniden yazılır. Bir blok kendi satırlarını ve bir girinti düzeyini, bir deyim bir satırı, birden çok satıra yayılmış bir nesne değişmezi ise satır başına bir girdiyi alır.

Yazdığınız hiçbir satır sonu asla silinmez ve geri kalan her şey bu kuraldan türer. JavaScript'te bir satırın sonu bir deyimi bitirebilir (otomatik noktalı virgül ekleme); bu yüzden iki satırı birleştirmek bir programın yaptığı şeyi değiştirebilir ya da ayrıştırılmasını engelleyebilir. Satır sonları yalnızca eklenir: bir bloğun süslü parantezlerinin çevresine, bir deyimin noktalı virgülünden sonra, bir nesnenin girdileri arasına ve bir kapanış süslü parantezi ile sonraki deyimi açan sözcük arasına. Bunların hiçbiri bir anlamı değiştiremez.

Kaynak kodun bir deyimin ortasında böldüğü bir satır (bir çağrı zinciri, uzun bir koşul, bir koşul ifadesinin dalları) üstündeki satıra göre bir düzey girintilenir; böylece onun bir parçası olarak okunmaya devam eder.

Örnekler

Durum Girdi Sonuç
Tek satıra yazılmış bir fonksiyon function add(a,b){const total=a+b;return total} function add(a, b) { const total = a + b; return total }

Sık sorulan sorular

Kodum bir yere gönderiliyor mu?

Hayır. Biçimlendirici, bu sayfada çalışan JavaScript'tir. Hiçbir şey yüklenmez, kaydedilmez ya da saklanmaz: internet bağlantınızı kesseniz bile araç çalışmaya devam eder.

Unuttuğum noktalı virgülleri ekleyecek mi?

Hayır. Yazılmamış bir noktalı virgül, bazen yazılmaması gereken bir noktalı virgüldür ve bu durumları ayırt etmek bir düzen geçişi değil, bir ayrıştırıcı gerektirir. Biçimlendirici bu soruya hiç karışmaz: asla noktalı virgül eklemez ve asla satır sonu silmez; bu yüzden noktalı virgülsüz yazılmış kod tam olarak aynı şekilde çalışmaya devam eder.

Küçültme de yapıyor mu?

Hayır; bu bir unutkanlık değil, bir karardır. Küçültmek; yeniden adlandırmak, yeniden yazmak ve hangi satır sonlarının anlam taşıdığına karar vermek demektir: bu aracın tam da yapmamak için var olduğu üç yargı. Bunlardan herhangi birinde yanılmak bir programı, ancak canlı ortamda fark edeceğiniz biçimde bozar.

TypeScript ya da JSX anlıyor mu?

Kısmen, ve bunu dürüstçe söylemek gerekir. İkisi de oldukları token'lar olarak okunur; bu yüzden hiçbir şey kaybolmaz ve parantezler ile süslü parantezler iç içe yerleşmeye devam eder, ama bir tür açıklaması ya da bir etiket, düzenin biçimini bildiği şeyler değildir. Dilin alışkanlıklarına tam uyan bir sonuçtan çok makul bir sonuç bekleyin.

Script'imin geçerli olup olmadığını söyler mi?

Hayır. Bir dilbilgisi yoktur, bu yüzden söyleyemez: bir kod parçasının nerede bitip sonrakinin nerede başladığını bilir; bu, bir dosyayı düzenlemeye yeter ama onu değerlendirmeye yetmez. Hiç okuyamadığı bir dosya (kapanmamış bir dize, yorum ya da şablon dizesi) inandırıcı görünen bir şeye dönüştürülmek yerine reddedilir.

Bilmekte fayda var

  • Çıktı, girdinin içerdiği parçaların tam olarak aynısını içerir. Hiçbir şey eklenmez, çıkarılmaz ya da yeniden sıralanmaz: yalnızca aradaki boşluklar yer değiştirir.
  • Bir eğik çizgi ya bir bölme işaretidir ya da bir regex'in başlangıcı; hiçbir tokenizer bir dilbilgisi olmadan hangisi olduğundan emin olamaz. Bu araç önceki token'a bakarak karar verir ve bir satır sonunu aşması gerekecek bir değişmezi bölme olarak okur, çünkü bir regex satır sonu içeremez. Yanlış bir tahminin bedeli biraz dağınıklıktan ibarettir, çünkü tüm parçalar yazıldıkları gibi kopyalanır.
  • Bir şablon dizesi, ters tırnaktan ters tırnağa, karakteri karakterine aynen geri gelir. İçindeki boşluklar sayfanızın göstereceği metindir; bu yüzden biçimlendiricinin dokunabileceği boşluklar değildir.
  • Düzen deterministiktir: aynı seçenekle aynı script her zaman aynı çıktıyı verir ve zaten biçimlendirilmiş bir script'i biçimlendirmek hiçbir şeyi değiştirmez.

Kaynaklar

Tüm Kod araçları