JavaScript’te String Interpolation: Kodunuzu Daha Temiz ve Verimli Hale Getirin
String ifadelerle çalışırken, içine değişkenleri dahil etmeye başladığımızda karşımıza çıkan zorlukları mutlaka deneyimlemişizdir. Neyse ki, bu sorunları çözmek için String Interpolation devreye giriyor. Şimdi bunu bir örnekle açıklayalım.
ul/li elementini değişken olarak tanımlama;
gördüğünüz gibi ul ve li elementlerini değişkenime alt alta tanımlamak istediğimde editörüm bana uyarı ışığı yakıyor ve izin vermiyor.
İyi senaryoda yukarıda ki gibi yan yana tanımlayabilirim ama okuması ne kadarda zor değil mi? Okunurluk gerçekten çok zor bir hale geliyor. Okunurluğu korumak istiyorsam yapabileceğim bir şey daha var gelin ona da birlikte bakalım;
Okunurluk kısmen de olsa gördüğünüz üzere arttı. Bence hala zor.. Ama burada daha major bir problemimiz var (+=) bir performans düşmanı olması. += operatörünü çok sık kullandığımızda, JavaScript’in performansını ciddi şekilde yavaşlatabilir. Çünkü her seferinde yeni bir string oluşturur ve bu da işlemci üzerinde fazladan yük yaratır. Özellikle uzun string işlemlerinde bu etki daha belirgin hale gelir. Neyse ki, modern JavaScript bize daha performanslı bir alternatif sunuyor;
Get Merve Özel’s stories in your inbox
Join Medium for free to get updates from this writer.
Backtick `` ile tanışma zamanı ;
mac için option+virgül
windows için altgr+ virgül +space
Yukarıda gördüğünüz gibi baktick ile tanımladığımda istediğim kadar boşluk bırakabilir string ifadelerimi istediğim gibi değişkene atayabilirim. Hatta tanımladığım farklı değişkenleri de ${ } aracılığıyla değişkenime kolayca ekleyebilirim. hemen bir örnek daha görelim;
Yukarıda gördüğünüz gibi, backtick ile tanımladığınızda, string ifadelerinde istediğiniz kadar boşluk bırakabilir ve değişkenleri istediğiniz gibi yerleştirebilirsiniz. Bu özellik, özellikle uzun projelerde oldukça işe yarar hale geliyor. String interpolasyonlarını ve backtick kullanmayı mutlaka denemeyi unutmayın; performans açısından da farkı hissedeceksiniz!
Sevgiler!
