Modern JavaScript öğrenme rehberi: temelden asenkron programlamaya

JavaScript'ten ne beklemeli, nereden başlamalı?

JavaScript, tarayıcıda yerel olarak çalışan başlıca programlama dilidir ve sunucu tarafında Node.js üzerinden de kullanılır. Bir web sayfasının etkileşimli kısmını yazmak, bir arayüz kütüphanesiyle uygulama geliştirmek ya da bir API sunucusu kurmak aynı dille yapılabilir. Bu geniş kullanım alanı, öğrenme yolunu da şekillendirir: hedefiniz ön yüz mü, sunucu mu, yoksa ikisi birden mi olduğuna göre vurgu değişir.

Başlangıç için yalnızca bir metin düzenleyici ve bir tarayıcı yeterlidir. Tarayıcının geliştirici konsolu, küçük kod parçalarını anında denemek için kullanılır. Öğrenmeye değişkenler, veri tipleri, koşullar, döngüler ve fonksiyonlarla başlanır. Bu temeller oturmadan framework'e geçmek, hataların nedenini anlamayı zorlaştırır. Dilin kendisini bilen biri bir kütüphaneyi hızla öğrenir; dili bilmeden kütüphane öğrenen kişi ise kalıpları ezberler ve ilk beklenmedik hatada takılır.

Modern JavaScript'in temel özellikleri

Dil, ECMAScript standardı üzerinden düzenli olarak gelişir. Bugünkü kod yazım biçimi, eski JavaScript örneklerinden belirgin biçimde farklıdır. Öğrenirken şu özellikleri tanımak gerekir: • let ve const ile değişken tanımı: var yerine blok kapsamlı değişken kullanımı, istenmeyen değer atamalarını azaltır. • Ok fonksiyonları ve şablon dizgileri: Daha kısa fonksiyon yazımı ve metin içinde değişken kullanımı. • Yapı bozma (destructuring) ile yayma ve toplama (spread/rest): Nesne ve dizilerden değer çekmek, kopyalamak ve birleştirmek. • Modüller: Kodu dosyalara bölüp içe ve dışa aktarma ile paylaşmak. • Dizi metotları: map, filter ve reduce ile veri dönüştürmek; döngü yazmadan okunabilir kod elde etmek. • İsteğe bağlı zincirleme ve null birleştirme: Var olmayabilecek değerlere güvenli erişim.

Bu özellikler ES6 ile gelen büyük bir yenilenmeyle başlamış, sonraki sürümlerle genişlemiştir. Hangi özelliğin hangi sürümde eklendiğini ezberlemek gerekmez; önemli olan bugünkü kodu okuyabilmek ve yazabilmek, ayrıca eski kodu modernleştirmeyi bilmektir.

Fonksiyonlar, kapanışlar ve kapsam: dilin asıl zorlukları

Yeni başlayanları en çok zorlayan konular dilin söz diziminden değil, çalışma mantığından gelir. Kapsam, bir değişkenin nerede görünür olduğunu belirler. Kapanış (closure), bir fonksiyonun tanımlandığı yerdeki değişkenlere sonradan da erişebilmesidir; sayaç üreten fonksiyonlar, olay dinleyiciler ve birçok kütüphane kalıbı buna dayanır. this anahtar kelimesi ise fonksiyonun nasıl çağrıldığına göre değer alır ve ok fonksiyonlarında farklı davranır.

Bu konuları anlamak için küçük deneyler yapılır: aynı fonksiyonu farklı biçimde çağırmak, konsolda değeri yazdırmak, hata mesajını okumak. Tip dönüşümü de sık sürpriz üretir; değerleri karşılaştırırken tip kontrolü yapan sıkı eşitlik operatörünü tercih etmek, hata ayıklama süresini azaltır.

Modül sistemi de bu aşamada öğrenilir: kodu dosyalara bölmek, bağımlılıkları açıkça belirtmek ve paket yöneticisiyle dış kütüphane kullanmak gerçek projelerin günlük işidir.

Asenkron JavaScript: olay döngüsü, Promise ve async/await

JavaScript tek iş parçacıklı çalışır; ağ isteği, zamanlayıcı ve dosya okuma gibi uzun işlerde programın tamamını bekletmez. Bunu olay döngüsü (event loop) sağlar: tamamlanan işler bir kuyruğa girer ve ana kod boşaldığında sırayla işlenir. Bu modeli anlamadan asenkron kod yazmak, bazı satırların neden beklenen sırada çalışmadığını açıklayamamak demektir.

Asenkron kodun evrimi şöyle okunabilir: önce geri çağrı (callback) fonksiyonları, iç içe geçince okunması zorlaşan yapılar. Ardından Promise, bir işin ileride tamamlanacak sonucunu temsil eden nesne. Son olarak async/await, Promise tabanlı kodu senkron gibi okunabilir yazma biçimi.

Dikkat edilecek noktalar: Hataları try/catch ya da Promise zinciri üzerinden yakalamak gerekir; ele alınmayan hata sessizce kaybolabilir. Birbirinden bağımsız istekleri sırayla beklemek yerine birlikte başlatmak performansı artırır. Döngü içinde her adımda await kullanmak, istenmeden işleri sıraya sokabilir. Bu tuzakları konsolda küçük örneklerle denemek, kuramı pekiştirir.

Öğrenme yolu: başlangıçtan ileri düzeye

Aşamalar birbirini izler. • Temel: Veri tipleri, koşullar, döngüler, fonksiyonlar, dizi ve nesne işleme. Küçük konsol alıştırmaları. • Tarayıcı: Sayfa öğelerini seçmek, olayları dinlemek, formla çalışmak. Basit bir yapılacaklar listesi ya da hesap makinesi. • Modern dil özellikleri: Yapı bozma, modüller, dizi metotları, sınıflar. Daha önce yazılmış bir projeyi modern söz dizimine çevirmek. • Asenkron programlama: Bir API'den veri çekip listelemek, hata durumunu ve yüklenme durumunu yönetmek. • Araçlar: Paket yöneticisi, derleme aracı, kod biçimlendirici, hata ayıklayıcı. Geliştirici araçlarında kesme noktası kullanmak. • Test ve kalite: Birim test yazmak, hata mesajlarını okumak, kodu sadeleştirmek. • Framework ve tür sistemi: Bir arayüz kütüphanesi ve ardından TypeScript'e geçiş.

Her aşamanın sonunda küçük ama çalışan bir proje çıkarmak, öğrenmeyi kalıcı kılar. Yalnızca video izlemek yerine, görülen her kavramı kendi örneğinizde yeniden yazmak daha çok iş görür.

JavaScript öğrenirken sık yapılan hatalar

• Eski örneklerden öğrenmek: Yıllar önce yazılmış bir anlatım, eşitlik karşılaştırması ve değişken tanımı gibi konularda güncel yaklaşımdan farklı olabilir. Kaynak seçerken güncelliğe bakın ve resmî dokümantasyonla kontrol edin.
• Framework'e erken geçmek: Dil temeli olmadan kütüphane öğrenmek, hata anında çaresizlik doğurur.
• Hata mesajını okumamak: Konsol mesajı sorunun satırını ve nedenini söyler.
• Kopyala-yapıştır bağımlılığı: Çalışan kodu anlamadan kullanmak, küçük bir değişiklikte yeniden tıkanmaya götürür.
• Asenkronu geçiştirmek: Gerçek uygulamaların büyük bölümü veri çekmeyi gerektirdiği için olay döngüsü ve Promise konusunu atlamak yarı yolda bırakır.
• Sürekli yeni şey öğrenmek: Her yeni kütüphaneye geçmek yerine, bir projeyi bitirmek daha öğreticidir.

Öğrenme sürecinde başkasının kodunu okumak ve kendi kodunuzu bir başkasına anlatmak da güçlü bir yöntemdir.

Bu beceriyi Mindset programlarında nerede çalışırsınız?

Modern JavaScript (ES2023+) ve Asenkron Programlama eğitiminin modülleri güncel dil özellikleri, fonksiyonlar, kapanışlar ve modüller, olay döngüsü ve yürütme modeli, Promise ve async/await, ileri asenkron desenler, hata ayıklama, test ve performans başlıklarından oluşur.

Modern Web Geliştirme, Frontend (React) eğitimi ise dil temelinin üzerine arayüz geliştirmeyi koyar: React ekosistemi, bileşen mimarisi, hooks ile state yönetimi, routing, performans optimizasyonu ile test ve kalite güvencesi.