İçindekiler[Saklamak][Göstermek]
- 1. Temel Bilgilerinizi Geliştirin
- 2. Nesneye yönelik bir stratejiden yararlanın
- 3. Küçük de olsa işlevlerden yararlanın
- 4. == yerine === kullanın
- 5. JSLint'i kullanın
- 6. Komut dosyaları sayfanızın altına yerleştirilmelidir
- 7. Bir İp Oluşturmanın En Hızlı Yolu
- 8. Kodunuza bir yorum ekleyin
- 9. Şablon Değişmezlerinden Yararlanın
- 10. Yineleyiciler ve … için Döngüler
- 11. new Object() Yerine {} Kullanın
- 12. Kodunuza let ve const koymayı düşünün
- 13. eval() İyi Bir Fikir Değil
- 14. Spread Operatörü işe yarar
- 15. bekle ve zaman uyumsuz
- 16. Javascript'te include() yöntemini kullanın
- 17. Eklemeyi kullanarak öğeleri diziden kaldırın
- 18. Ok İşlevinden Yararlanın
- 19. Destructuring ile hızlı bir şekilde değişken değerler atayabilirsiniz.
- 20. Birkaç proje yapın
- Sonuç
Web geliştirme ile daha önce ilgilendiyseniz, muhtemelen JavaScript ile karşılaşmışsınızdır. Nesne yönelimli bir programlama dili JavaScript'tir. Geliştiriciler bunu web sayfalarını istemci tarafı (ön uç) dinamik ve etkileşimli hale getirmek için kullanır.
HTML ve CSS ile web sayfaları ve web uygulamaları oluşturmak için de kullanılır. Günümüzde internette JavaScript kodu olmayan bir web sayfası yoktur. Bir geliştiricinin işinin ayrılmaz bir yönü haline geldi.
Nitekim giderek artıyor. JavaScript, en iyi web sayfalarına işlevsellik sağlamakla tanınmakla birlikte, JavaScript olmayan ortamlarda da kullanılır. Node.js, Apache Couch-DB ve Adobe Acrobat bu teknolojilerin örnekleridir. JavaScript'i çalıştırmak için çoğu modern web tarayıcısı, yerleşik bir JavaScript yürütme motoru içerir. Başarılı bir web geliştiricisi olmak istiyorsanız JavaScript ile uğraşmanız gerekecek.
Bugün ya da yarın halletmelisin. Zamanı geldiğinde hazırlıklı olmak için neden JavaScript'i önceden öğrenmiyorsunuz?
Bu seansta öğreneceğiniz şey bu. JavaScript'inizi parlatarak diğer web geliştiricilerinizden nasıl bir adım önde kalacağınızı açıklar.
Hadi başlayalım!
1. Temel Bilgilerinizi Geliştirin
Gençliğinizden beri duyduğunuz çok basit bir düşünce ve ifadeyle başlayacağım. Temel bilgileri öğrenin ve uygulamaya koyun. Çoğu zaman, kodlama ile mantık uygulayacaksınız, ancak bunun için zaten yerleşik bir işlev olduğunu unutacaksınız, örneğin bir diziyi dilimlemek gibi. JavaScript kodunu çalıştırdığınızda bir hata alabilirsiniz ve bunun sonucunda birçok ek özellik çalışmayı durdurur.
Bu, tek bir iki nokta üst üste veya ters çevrilmiş virgüllerden kaynaklanabilir. Bu tür şeyler, temel kavramların anlaşılmamasının bir sonucu olarak ortaya çıkar. Çoğu zaman tek bir programda for, that veya do while gibi temel bir döngü kullanılır. Döngüler, en temel programlama yapılarından biridir.
Döngü ve diğer temellere aşina değilseniz, kodlamak ve hatta bir firmada çalışma şansına sahip olmak oldukça zordur. Temellerinizi tazelemek çok önemlidir, çünkü bunlar bir çözümün karmaşık mantığını ve itibarını geliştirmek için sağlam bir temel sağlar.
2. Nesneye yönelik bir stratejiden yararlanın
Nesne yönelimli yöntem, günümüzde en iyi bilinen programlama yaklaşımıdır. C++ ile başlayan nesne yönelimli yaklaşım, o zamandan beri muazzam bir popülerlik kazandı. Bugün, tüm ana dilleri oluşturmak için yalnızca nesne yönelimli programlama kullanılmaktadır. Nesneye yönelik strateji, belirli bir nesneye odaklanan stratejidir.
Öğe daha sonra temel bir varlık haline gelir. Bu nesne daha sonra sayfaya temel olarak nitelikler ve işlevler eklemek için kullanılır. Herhangi bir işlev veya nesne olmadan yukarıdan aşağıya kod oluşturmanın geleneksel yöntemini de kullanabilirsiniz. Bu çok kapsamlıdır ve asla denenmemelidir. Kod geliştirirken işlevsel bir yaklaşım kullanmalı, işlevlerden yararlanıyorsak nesneleri kullanmalıyız.
Bu nedenle, başlangıçta kapsamlı kodunuzu nesne yönelimli koda dönüştürmeye çalışın ve kodunuzu her zaman nesne yönelimli bir tarzda yazın. Başkalarının kodunu incelerken, sürekli olarak nesne yönelimli tekniklere bakıyor olacaksınız. JavaScript'te ustalaşmak istiyorsanız, elinize almanız en iyisidir.
3. Küçük de olsa işlevlerden yararlanın
İşlevsel bir yaklaşımla programlama, gitmek için harika bir yoldur. Neden? Niye? Yazılımınızı birlikte çalışan ancak yine de birbirinden farklı modüllere ayırır. Anlamanıza yardımcı olacak bir örnek vereyim.
Tam sayıların Kök Ortalama Karesi bir fonksiyon kullanılarak hesaplanabilir. Bunu yapmak için, tam sayıların karesini almalı, ortalamalarını hesaplamalı ve ardından ortalamanın karekökünü hesaplamanız gerekir. Süreçte üç aşama vardır. Sonuç olarak, üç işlevi kullanabiliriz. Ancak, gördüğünüz gibi, tüm bu işlevler birbirine bağlıdır. Birinin çıktısı diğerine gönderilir ve nihai sonucu alırız.
RMS'yi birden çok faktöre dayalı olarak hesaplamak için üç işlev yerine bir tanesine ihtiyacınız olduğunu varsayalım. Gördüğünüz gibi nihai çözüm yanlış. Bu kadar büyük bir olayda neyin yanlış gittiğini belirlemeniz bu noktada oldukça zor olacaktır.
Üç küçük fonksiyona sahip olmak ise hızlı analiz yapmanızı sağlayacaktır. Sonuç olarak, işlevler mütevazı olsa bile, bunları farklı kod modülleri tanımlamak için kullanın. Bu teknik, sihir gibi bir JavaScript uzmanı olmanıza yardımcı olacaktır.
Şimdi bazı JavaScript kodlama ipuçlarına bakalım.
4. == yerine === kullanın
JavaScript'te iki tür eşitlik operatörü vardır: katı eşitlik operatörleri === ve !== ve katı olmayan eşitlik operatörleri == ve !=. Karşılaştırma yaparken, her zaman tam eşitliği kullanmak en iyi uygulama olarak kabul edilir. == ve != ile çalışırken, farklı türlerle uğraşırken sorunlarla karşılaşırsınız.
Karşılaştırdığınız değerlerin türleri farklı olduğunda, katı olmayan operatörler değerlerini zorlamaya çalışacak ve bu da beklenmedik sonuçlara yol açabilecektir.
5. JSLint'i kullanın
Douglas Crockford, bir hata ayıklayıcı olan JSLint'i yarattı. Komut dosyanızı kutuya koymanız yeterlidir; herhangi bir hata veya kusur için hızlı bir şekilde tarayacaktır.
JSLint, bir JavaScript kaynak dosyasını inceler. Bir sorun bulunursa, sorunun açıklamasını ve kaynak içindeki yaklaşık konumunu içeren bir mesaj gönderir. Sorun, her zaman sözdizimsel bir hata değildir, ancak sıklıkla böyledir.
JSLint, hem biçimsel normları hem de yapısal sorunları inceler. Bu, yazılımınızın doğru olduğu anlamına gelmez. Sorunların tespit edilmesine yardımcı olmak için sadece başka bir çift göz ekler. Bir komut dosyasında oturumu kapatmadan önce, herhangi bir hata yapmadığınızdan emin olmak için onu JSLint üzerinden çalıştırın.
6. Komut dosyaları sayfanızın altına yerleştirilmelidir
Kullanıcının birincil amacı, sayfanın olabildiğince hızlı yüklenmesidir. Tarayıcı, dosyanın tamamı yüklenene kadar bir komut dosyasını yüklemeye devam edemez. Sonuç olarak, kullanıcının herhangi bir ilerleme görmek için daha uzun süre beklemesi gerekecek.
Yalnızca işlevsellik sağlamak için kullanılan JS dosyalarınız varsa (örneğin, bir düğmeye basıldığında), bunları sayfanın alt kısmına, kapanış gövde etiketinden hemen önce koyun. Bu tartışmasız en iyi uygulamadır.
7. Bir İp Oluşturmanın En Hızlı Yolu
Bir dizi veya nesne etrafında döngü yapmanız gerektiğinde, her zaman güvenilir for döngüsü ifadenizi kullanmayın. Eldeki görev için en hızlı çözümü bulmak için hayal gücünüzü kullanın. Size sayıları getirmeyeceğim; sadece bana güvenmen (veya kendin için test etmen) gerekecek.
Bu şimdiye kadarki en hızlı tekniktir.
8. Kodunuza bir yorum ekleyin
İlk başta anlamsız görünebilir, ancak kodunuz hakkında mümkün olduğunca sık yorum yapmanız gerektiğini söylediğimde bana güvenin. Aylar sonra projeye geri dönerseniz ve orijinal düşünce sürecinizi hatırlayamıyorsanız ne olur?
Ya kodunuzun iş arkadaşlarınızdan biri tarafından güncellenmesi gerekiyorsa? Kodunuzun önemli alanları her zaman yorumlanmalıdır.
9. Şablon Değişmezlerinden Yararlanın
Çift veya tek tırnak ile oluşturulan dizelerin kısıtlamaları çoktur. Onlarla çalışmayı çok daha kolay hale getirmek için, bazı dizelerinizi şablon değişmezleriyle değiştirmeyi seçebilirsiniz.
Backtick karakteri ('), bir dizi avantajı olan şablon değişmezleri oluşturmak için kullanılır. Bunları ifadeleri depolamak veya çok satırlı dizeler oluşturmak için kullanabilirsiniz.
Gördüğünüz gibi, tek veya çift tırnaklarla oluşturulmuş geleneksel bir dize değişmezinin aksine, şablon değişmezimize tekrar tekrar girip çıkmak zorunda değildik. Bu, yazım hataları olasılığını en aza indirir ve daha temiz kod yazmamızı sağlar.
10. Yineleyiciler ve … için Döngüler
Yineleyiciler, sonraki değeri bir dizide saklayan bir nesneyi döndürmek için next() yöntemini uygulayan JavaScript'teki nesnelerdir ve daha fazla değer olup olmadığına bağlı olarak doğru veya yanlıştır. Bu, yineleyici protokolünü uygularsanız, kendi yineleyici nesnelerinizi oluşturabileceğiniz anlamına gelir.
JavaScript'te String, Array, Map vb. gibi bazı yerleşik yineleyiciler vardır. Bunlar arasında yineleme yapmak için for … of döngülerini kullanabilirsiniz. Sıradan for döngüleriyle karşılaştırıldığında, bu daha özlü ve daha az hataya açık. Bir for…of döngüsü kullanarak dizinin tam uzunluğunu veya geçerli dizini izlememiz gerekmez. İç içe döngüler tasarlarken bu, kodu basitleştirmeye yardımcı olabilir.
11. new Object() Yerine {} Kullanın
JavaScript'te nesneleri çeşitli şekillerde yapabilirsiniz. Gösterildiği gibi yeni kurucuyu kullanmak daha geleneksel bir yoldur. Öte yandan bu strateji “kötü uygulama” olarak işaretlenmiştir.
Yıkıcı değil, ama biraz endişeli ve benzersiz. Bunun yerine nesne değişmez tekniğini kullanmayı öneriyorum.
12. Kodunuza let ve const koymayı düşünün
Kendi bloklarına göre kapsamlandırılmış yerel değişkenler yapmak için let anahtar sözcüğünü kullanabiliriz. Değiştirilemeyen yerel blok kapsamlı değişkenler oluşturmak için const anahtar sözcüğünü kullanabiliriz.
Değişkenleri bildirirken, uygun olduğunda let ve const anahtar sözcüklerini kullanmayı düşünmelisiniz. const anahtar sözcüğünün yalnızca yeniden atamayı devre dışı bıraktığını unutmayın. Değişkeni de değişmez yapmaz.
13. eval() İyi Bir Fikir Değil
Eval() yöntemi, farkında olmayanlar için JavaScript'in derleyicisine erişmemizi sağlar. Esasen, bir girdi () olarak sağlayarak bir dizgenin sonucunu yürütmek için eval kullanabiliriz.
Bu yalnızca betiğinizi önemli ölçüde yavaşlatmakla kalmaz, aynı zamanda iletilen metne çok fazla yetki verdiği için önemli bir güvenlik sorunu da sunar. Her ne pahasına olursa olsun kaçının!
14. Spread Operatörü işe yarar
Bir dizideki tüm öğeleri ayrı öğeler olarak başka bir işleve aktarmaya hiç ihtiyaç duydunuz mu, yoksa tüm değerleri bir diziden diğerine mi koymanız gerekiyor? Bu tam olarak yayılma operatörünün (…) başarmamıza izin verdiği şeydir. İşte bir örnek.
15. bekle ve zaman uyumsuz
Açıkça veya dolaylı olarak her zaman bir söz veren async anahtar sözcüğünü kullanarak zaman uyumsuz işlevler oluşturun.
Bekleyen anahtar sözcük, geri dönen vaatlerin çözümü tamamlanana kadar yürütmeyi durdurmak için eşzamansız işlevlerde kullanılabilir. Zaman uyumsuz işlevinizin dışında, kod normal şekilde çalışmaya devam edecektir.
16. Javascript'te include() yöntemini kullanın
JavaScript'te, include() işlevi, bir dizenin sağlanan karakterleri içerip içermediğini veya bir dizinin belirtilen öğeyi içerip içermediğini belirler.
Bu yöntem, dize veya öğe keşfedilirse true değerini döndürür; aksi halde false döndürür. Strings include() işlevinin büyük/küçük harfe duyarlı olduğunu belirtmekte fayda var. Büyük/küçük harfe bakılmaksızın bir dize eşleştirmek istiyorsanız, önce hedef metni küçük harfle yazmanız yeterlidir.
17. Eklemeyi kullanarak öğeleri diziden kaldırın
Bir diziden bir öğeyi kaldırmak için geliştiricilerin silme işlevini kullandığını gördüm. Bu hatalıdır, çünkü silme yöntemi nesneyi silmek yerine onu tanımsız ile değiştirir.
JavaScript'teki değerine bağlı olarak bir öğeyi diziden çıkarmanın en kolay yolu, dizideki o değerin dizin numarasını almak için indexOf() işlevini kullanmak ve ardından bu dizin değerini splice() yöntemiyle silmektir.
18. Ok İşlevinden Yararlanın
Ok işlevleri, JavaScript'e yeni eklenen bir diğer önemli özelliktir.
Bir tekne dolusu avantajı var. Başlangıç olarak, JavaScript'in işlevsel kısımlarını görsel olarak daha çekici ve yazmayı daha kolay hale getiriyorlar. Ancak ok işlevlerini kullanmak bunu çok daha okunaklı ve özlü hale getirir.
19. Destructuring ile hızlı bir şekilde değişken değerler atayabilirsiniz.
Bu yazının başlarında, JavaScript'teki yayılma operatörü hakkında bilgi edindik. Yıkım, diziler içinde yer alan verileri de açması bakımından, yok etmeye benzer.
Aradaki fark, bu paketlenmemiş değerlerin farklı değişkenlere atanabilmesidir. Sözdizimi, bir dizi oluştururken [] kısayolununkiyle aynıdır. Ancak parantezler bu sefer atama operatörünün sol tarafına yerleştirilmiştir. İşte bir örnek.
20. Birkaç proje yapın
Herhangi bir yetenek tutarlı bir uygulama gerektirir, bu nedenle yeteneklerinizi geliştirmek ve çeşitli programlama senaryolarıyla uzmanlık kazanmak için çeşitli projeler oluşturmaya çalışın.
Projeler üzerinde çalışırken, size gerekli uzmanlığı sağlayacak çeşitli zorluklar ve hatalarla karşılaşacaksınız. Bu yüzden projeler üretmeye çalışın ve internette size yardımcı olacak çok sayıda fikir ve örnek var. Kod geliştirmeye devam edin, yetenekleriniz gelişecektir.
Sonuç
JavaScript gibi bir bilgisayar dilini öğrenmek zor olabilir. İyi bir programcı olmak ve ilk işinizi güvence altına almak konusunda ciddiyseniz, bu JavaScript öğrenme stratejileri, öğrenme sürecinizi hızlandırmanıza yardımcı olabilir.
Düzenli olarak kodlama pratiği yaptığınızdan, yeni fikirler öğrenirken kapsamlı notlar aldığınızdan ve erişebileceğiniz tüm araçları kullandığınızdan emin olun. Her şeyden önce, dışarı çıkın ve eğlenirken kodlamaya başlayın.
Yorum bırak