JavaScript Temelleri: Değişken, Fonksiyon ve Döngü Örnekleri

Giriş

JavaScript, web uygulamaları ve pek çok modern geliştirme akışında kullanılan temel bir programlama dilidir. Bu rehberde değişkenler, fonksiyonlar ve döngüler gibi temel yapı taşlarını adım adım örneklerle anlatarak başlangıç seviyesindekilere pratik bir yol haritası sunuyorum. Temel kavramların tanımları ve daha detaylı referanslar için MDN Web Docs'un rehberlerine bakabilirsiniz: MDN JavaScript Guide ve Statements and declarations.

Değişkenler: let, const ve var

Değişkenler, uygulamanızın çalışması sırasında veriyi saklamak için kullanılır. Modern JavaScript'te en sık kullanılan iki anahtar kelime let ve const'tır; eski kodlarda ise var ile karşılaşabilirsiniz. Bu anahtar kelimeler arasındaki farklar, kapsam (scope) ve yeniden atama (reassignment) davranışlarıyla ilgilidir.

Özet:

• let: blok kapsamlıdır; değer ataması yapılabilir.
• const: blok kapsamlıdır; yeniden atamaya izin vermez, ancak nesne veya dizi içeriği değiştirilebilir.
• var: fonksiyon kapsamlıdır ve hoisting davranışı farklılıkları olabilir; modern kodda genellikle let/const tercih edilir.

Aşağıda basit örnekler görebilirsiniz (tarayıcı konsolunda veya Node.js ortamında çalıştırabilirsiniz):

Basit değişken kullanımı:
let sayi = 10;
const isim = 'Ali';
var renk = 'mavi';

const ile nesne/dizi değişikliği:
const liste = [1, 2];
liste.push(3); // Dizi içeriği değişir ve bu geçerlidir
// liste = []; // yeniden atama yapılmaya çalışılırsa hata olur

Detaylı teknik açıklamalar ve kapsam davranışları için MDN'deki değişken bildirimleri sayfası yararlı olacaktır: Statements and declarations.

Fonksiyonlar: declaration, expression ve arrow

Fonksiyonlar belirli bir görevi yerine getiren kod bloklarıdır. JavaScript'te farklı tanımlama biçimleri vardır ve her birinin kullanım yeri değişiklik gösterebilir.

• Function declaration (bildirim): function anahtar kelimesiyle tanımlanır ve hoisting etkisi vardır.
• Function expression (ifade): bir değişkene atanan fonksiyondur; hoisting bu tanımlama için aynı şekilde çalışmaz.
• Arrow functions (ok fonksiyonları): daha kısa söz dizimi sağlar ve this bağlamını üst kapsamdan alır; MDN'de ok fonksiyonları hakkında teknik açıklamalar bulunmaktadır: Arrow function expressions.

Örnekler:

Fonksiyon bildirimi:
function topla(a, b) {
return a + b;
}

Fonksiyon ifadesi:
const carp = function(a, b) {
return a * b;
};

Ok fonksiyonu:
const kare = x => x * x;
const selam = (isim = 'Dünya') => `Merhaba, ${isim}`;

Ok fonksiyonlarının this bağlamı ve constructor olarak kullanılamaması gibi önemli davranış farklılıkları vardır; bu tür ayrıntılar için MDN açıklamalarını inceleyin: MDN — Arrow function expressions.

Döngüler: for ve while

Döngüler, aynı kod bloğunu birden çok kez çalıştırmak için kullanılır. En temel döngüler for ve while döngüleridir. Döngüler içinde koşul kontrolü, sayaç güncellemesi ve gerekirse break veya continue ile akış kontrolü yapılır.

for döngüsü örneği:
for (let i = 0; i < 5; i++) {
console.log(i);
}

while döngüsü örneği:
let i = 0;
while (i < 5) {
console.log(i);
i++;
}

Dizilerle çalışırken klasik for döngüsü dışında okunabilirlik için dizi metodları veya for...of gibi yapıların tercih edildiği durumlar vardır. Temel kullanımda for ve while, belirli bir koşul sağlandığı sürece tekrar etmek için yeterlidir.

Pratik Örnek: Çift Sayıları Filtreleme

Aşağıda değişken, fonksiyon ve döngüyü birlikte kullanan basit bir örnek yer alıyor. Bu fonksiyon bir sayı dizisinden çift olanları döndürür.

Örnek kod:
function ciftleriBul(dizi) {
const sonuc = [];
for (let i = 0; i < dizi.length; i++) {
if (dizi[i] % 2 === 0) {
sonuc.push(dizi[i]);
}
}
return sonuc;
}
// Kullanım:
const sayilar = [1, 2, 3, 4, 5, 6];
console.log(ciftleriBul(sayilar)); // Beklenen çıktı: [2, 4, 6]

Bu örneği deneyerek fonksiyon mantığını, dizi erişimini ve döngü kontrolünü aynı anda görmüş olursunuz.

Adım Adım Öğrenme Planı ve Kontrol Listesi

1. Temel sözdizimini öğrenin: değişkenler (let/const), temel veri tipleri ve operatörler.
2. Fonksiyon yazın: parametre-alan, dönüş değeri olan küçük fonksiyonlar oluşturun.
3. Döngüleri deneyin: for ve while ile dizileri ve sayıları işleyin.
4. Kodunuzu tarayıcı konsolunda çalıştırın: küçük değişiklikler yapıp sonucu gözlemleyin.
5. Pratik yapın: günlük küçük görevler için fonksiyonlar yazın (ör. filtreleme, dönüştürme).
6. Referanslara dönün: kavram netleşmediğinde MDN rehberlerini kontrol edin.

Hızlı kontrol listesi:

• Varsayılan olarak const kullanın; değiştirecekseniz let tercih edin.
• Küçük ve tek sorumluluk sahibi fonksiyonlar yazın.
• Döngülerde sonsuz döngüye dikkat edin; koşulun değiştiğinden emin olun.

Nasıl Deneyebilirim?

Basitçe bir tarayıcıda geliştirici aracını (console) açıp örnek kodları yapıştırarak çalıştırabilirsiniz. Alternatif olarak bir .js dosyası oluşturup Node.js ile çalıştırabilirsiniz. Daha ileri adımlar için MDN'deki rehberler kapsamlı referans sağlar: MDN JavaScript Guide.

Sonuç ve Sonraki Adımlar

Bu rehber, JavaScript'in temel yapı taşları olan değişkenler, fonksiyonlar ve döngüler hakkında pratik ve uygulanabilir örnekler sundu. Temel bilgileri öğrendikten sonra küçük projeler yaparak ve MDN gibi güvenilir dokümantasyonlardan yararlanarak bilgilerinizi kalıcı hale getirebilirsiniz. İleri konular için ES6 özellikleri, asenkron programlama ve DOM manipülasyonu gibi konulara geçebilirsiniz.

Kaynaklar: MDN Web Docs (JavaScript Guide ve ilgili referans sayfaları).