g u t x .com.tr İpek yolu - Çin'i anlamaya götürürüm

En iyi JavaScript uygulamalarını uygulayın - eski yapıları kullanmaktan kaçınmaya dikkat edin

Tam metin 2632 Kelimeler, tahmini öğrenme süresi 8 dakika

Kaynak: Pexels

Diğer herhangi bir programlama dili gibi, JavaScript'in de programı okumayı ve sürdürmeyi kolaylaştırmak için kendi en iyi uygulamalar listesi vardır.

JavaScript'in birçok küçük tuzağı olduğundan, bunlardan kaçınmaya dikkat edin. Bazı en iyi uygulamaları kolayca izleyerek JavaScript kodunun okunmasını kolaylaştırabilirsiniz.

Bu makale, genel değişkenleri bildirmek, dizeleri setInterval ve setTimeout'a geçirmek ve with ifadesini kullanmak gibi kaçınılması gereken yanlış anlamaları tanıtacaktır.

Global değişkenleri bildirmekten kaçının

Sebep ne olursa olsun, global değişkenleri kullanmaktan kaçınmalısınız.

Birincisi, farklı yerlerde kolaylıkla üzerine yazılabilmeleridir, çünkü global değişkenler her yerde mevcuttur. Ek olarak, global değişkenler pencere nesnesinin özellikleridir ve ayrıca pencere nesnesinin içeriğini de kapsayabilir.

Bu iki sorun, kodun yürütülmesini zorlaştırır. Bu nedenle mümkün olduğunca yerel değişkenler tanımlanmalıdır.

Yerel değişkenleri tanımlamak için var, let veya const anahtar sözcüklerini kullanabilirsiniz.

Var ile tanımlanan değişkenler, tanımlanmadan önce tanımlanan seviyede ve altında mevcuttur. Örneğin, aşağıdaki kod:

const log = () = > { console.log (x); } log (); var x = 1; log ();

Kodda, birinci console.log'daki x tanımsızdır ve ikinci günlükteki x 1'dir.

Aşağıdaki aynı koddur:

var x; constlog = () = > { console.log (x); } log (); x = 1; log ();

Let ile bildirilen değişkenler yalnızca tanımlandıktan sonra kullanılabilir, bu nedenle aşağıdaki kod verilirse:

const log = () = > { console.log (x); } log (); let x = 1; log ();

Aşağıdaki hata mesajı görünecektir:

Yakalanmamış Referans Hatası: Başlatmadan önce "x" e erişilemiyor

Yalnızca bir kez tahsis edilebilen ve tekrar tahsis edilemeyen bir sabit tanımlamak için const anahtar sözcüğünü kullanın. Var'ın aksine, bu tür sabitler yalnızca bildirimden sonra kullanılabilir.

Örneğin, aşağıdaki kod:

{console.log (x);} const x = 1; log ();

Const x = 1'den önce günlük çağrılması da aşağıdaki hata mesajına neden olur:

Yakalanmamış Referans Hatası: Başlatmadan önce "x" e erişilemiyor

Değişkenleri programın farklı bölümlerinde kullanmak istiyorsanız, JavaScript modüllerini kullanmalı ve ardından bu modülleri kodu yayınladığınızda bir veya daha fazla büyük dosyada oluşturmalısınız. Bu yöntem ES6'dan beri uygulanabilir.

Kaynak: Pexels

Değişkenleri dışa aktarabilir ve bunları diğer modüllere aktarabilirsiniz. Tüm modülü dışa aktarmak için "Varsayılanı Dışa Aktar" seçeneğini de kullanabilirsiniz. Bu şekilde sadece modül dışında olması gereken parçalar dışa aktarılabilir ve diğerleri görünmezdir.

Ek olarak, değişkenleri işlevlere kaydetmek için kapanışları kullanabilirsiniz, bu da harici çağrıları engelleyebilir. Aşağıdaki basit bir kapatma kullanımıdır:

= () = > {sabit x = 3; dönüş () = > x * 2;}

Harici aramalardan kaçınmak ve x'i işleyen bir işlev döndürmek için x'i bölme işlevinde tutun.

Ardından aşağıdaki kod çağrısını yazın:

console.log (divide () ());

Dizeleri setInterval veya setTimeout'a geçirmeyin

Dize, setInterval veya setTimeout işlevinin ilk parametresine aktarılmamalı, ancak geri çağrı işlevi iletilmelidir.

Geri arama işlevi yerine bir dize geçirilirse, tarayıcı, çok yavaş olan ve kod enjeksiyon saldırılarına karşı savunmasız olan dizedeki kodu çalıştırmak için eval kullanacaktır.

Bu nedenle, dinamik olarak üretilen kodu gerçekten çalıştırmamız gerekmedikçe yukarıdaki işlemleri yapmak için bir neden yoktur, ancak bu çok, çok nadir bir durum olmalıdır.

Aşağıdaki kod yazılmamalıdır:

setTimeout (() = > {document.getElementById ('foo'). textContent = 'foo';}, 1000);

Aşağıdaki kod yazılmalıdır:

setTimeout (() = > {document.getElementById ('foo'). textContent = 'foo';}, 1000);

"With" ifadesini kullanmayın

Yüzeyde, with ifadesi, bir nesnenin derinlemesine yuvalanmış özelliklerine erişmek için iyi bir kısayol gibi görünmektedir. Örneğin şunları yazabilirsiniz:

let obj = { foo: { bar: { baz: 1 } } } obj.foo.bar.baz = 2;

Onun yerine:

let obj = { foo: { bar: { baz: 1 } } } ile (obj.foo.bar) { var baz = 2; }

Ancak bu bile global nesneye müdahale edecek ve baz'a with ifadesi dışında erişilip erişilemeyeceğini belirsizleştirecektir. Çünkü with deyiminde yeni değişkenler de tanımlayabilirsiniz:

let obj = { foo: { bar: { baz: 1 } } } ile (obj.foo.bar) { var baz = 2; }

Burada baz değişkeni with ifadesi içinde bildirilir, ancak dışarıdan çağrılamaz.

Neyse ki, with ifadesine JavaScript katı modunda izin verilmiyor, bu yüzden şimdi endişelenmeyin.

var anahtar kelime

ES6'da, sırasıyla değişkenleri ve sabitleri bildirmek için blok kapsamının let ve const anahtar sözcüklerini kullanabilirsiniz. Değişkenleri bildirmek için kullanılabilmelerinin nedeni, net bir kapsama sahip olmalarıdır.

Var ile bildirilen değişkenlerin kullanım kapsamı oldukça belirsizdir. If bloğu veya döngü gibi bir program bloğunda bildirilmişse, bildirilen değişken bloğun dışında bulunur.

Örneğin:

for (let i = 0; i < 10; i ++) { var j = i; } console.log (j);

Bu durumda, var kullanmak mümkündür, ancak değişkenleri bildirmek için var yerine let'i kullanırsanız, bir hata alırsınız.

Kapsam kafa karıştırıcı olduğundan, değişkenleri bildirmek için var kullanmayı bırakmalıyız.

Kaynak: Pexels

JavaScript ile programlama yaparken, JavaScript'in önceki sürümlerinde bulunan birçok eski yapıdan kaçınmak istiyoruz. Bu yapıların kullanılması, kodun okunmasını zorlaştırır ve kolayca hatalar oluşturabilir.

İlk olarak, genel kapsamda yanlışlıkla alıntı yapılmasını ve içerik bildirimini önlemek için genel değişken bildirimlerinden kaçının. Bu aynı zamanda bir global değişkenin değerini yanlışlıkla değiştirme olasılığını da azaltır.

İkinci olarak, dizedeki kodu iletmeyi bırakmalısınız, ancak geri çağrı işlevini setTimeout ve setInterval işlevlerinin ilk parametresine iletmelisiniz. Dizide saklanan kodu çalıştırmak için eval kullanılacağından, bu, programı kod enjeksiyon saldırılarına maruz bırakır ve hız çok yavaş olur.

Ayrıca, global nesnede değişkenler yarattığı için with ifadesini kullanmaktan kaçınmalısınız.

Benzer şekilde, var anahtar sözcüğü tarafından bildirilen değişkenin kapsamı oldukça belirsiz olduğundan, değişkenleri bildirmek için var anahtar sözcüğünü kullanmaktan kaçınmalısınız.