JavaScript Academy · Ders

Modül Deseni (IIFE)

Kodu hemen çağrılan işlevlerle kapsülleyin.

Modül Deseni (IIFE), CoddyKit'te ücretsiz bir JavaScript Academy dersidir. Bu, 4 dersinin 3. dersidir. Aşağıdan dersin tamamını ücretsiz okuyabilir, sonra tarayıcıda yerleşik kod editörü ve 7/24 yapay zeka koçu ile uygulamalı olarak pratik yapabilirsin. Bu, JavaScript Academy öğrenme yolunun bir parçasıdır ve ilerlemeniz web ve CoddyKit uygulaması arasında senkronize olur. JavaScript Academy kursu toplamda 4 dersten oluşur.

Modül Kalıbının Çözdüğü Sorun

ES modüllerinden önce modül kalıbı, ilgili durum ve davranışları bir araya getirmenizi, iç işleyişi özel tutmanızı ve temiz bir genel arayüz sunmanızı sağlıyordu. Bu yapı kapanımlar üzerine kuruludur.

IIFE

IIFE (hemen çağrılan işlev ifadesi), tanımlandığı anda çalışan bir işlevdir. İşlevi parantez içine alıp çağırmak, anında özel bir kapsam oluşturur.

const result = (function () {
  return 42;
})();
console.log(result); // 42

Neden Hemen Çalıştırılır

IIFE, adlandırılmış bir işlevi ortada bırakmadan tek kullanımlık özel bir kapsam sağlar. İçerideki her şey genel ad alanından yalıtılır.

(function () {
  const temp = "not global";
  console.log(temp);
})();
// temp is unreachable out here

Genel Arayüz Döndürme

Modül kalıbı, bir nesne döndüren IIFE'dir. Nesne yöntemleri özel değişkenleri kapsayan kapanımlardır ve genel arayüzü oluşturur.

const counter = (function () {
  let count = 0; // private
  return {
    inc: () => ++count,
    value: () => count
  };
})();
counter.inc();
console.log(counter.value()); // 1

Özel ve Genel

İçeride tanımlanan ancak döndürülmeyen her şey özel kalır. Yalnızca döndürülen nesneye koyduklarınıza erişilebilir.

const calc = (function () {
  const pi = 3.14159; // private constant
  return {
    area: (r) => pi * r * r
  };
})();
console.log(calc.area(2)); // 12.56636
console.log(calc.pi);      // undefined

Özel Yardımcılar

Yardımcı işlevler modülün içinde bulunabilir; genel yöntemler tarafından kullanılır, ancak hiçbir zaman dışarı sunulmaz.

const validator = (function () {
  const clean = (s) => s.trim().toLowerCase(); // private
  return {
    isEmail: (s) => clean(s).includes("@")
  };
})();
console.log(validator.isEmail(" A@B.com ")); // true

Açığa Çıkaran Modül Kalıbı

Yaygın bir çeşitte tüm işlevler özel olarak tanımlanır, ardından genel işlevlere yapılan başvuruları «açığa çıkaran» bir nesne döndürülür. Bu, genel arayüz listesini en altta açıkça görmenizi sağlar.

const store = (function () {
  let items = [];
  function add(x) { items.push(x); }
  function count() { return items.length; }
  return { add, count }; // reveal
})();
store.add("a");
console.log(store.count()); // 1

Tekil Örnekler

IIFE bir kez çalıştığı için, bir modül fiilen tekil bir örnektir: tek bir özel durum kümesine sahip tam olarak bir örnek vardır.

const config = (function () {
  let settings = { theme: "dark" };
  return {
    get: (k) => settings[k],
    set: (k, v) => { settings[k] = v; }
  };
})();
config.set("theme", "light");
console.log(config.get("theme")); // "light"

Bağımlılıkları Geçirme

Genel değişkenleri veya diğer modülleri IIFE bağımsız değişkenleri olarak geçirebilir, böylece bağımlılıkları açıkça belirtebilir ve güvenli küçültmeyi mümkün kılabilirsiniz.

const mathUtils = (function (M) {
  return { roundUp: (n) => M.ceil(n) };
})(Math);
console.log(mathUtils.roundUp(4.1)); // 5

Genel Kirliliği Önleme

Asıl amaç, düzinelerce başıboş değişken yerine tek bir genel ad (modül) kullanmaktır. Bu, betikler arasındaki ad çakışmalarını önler.

ES Modülleriyle İlişkisi

Günümüzde import/export, dil düzeyinde gerçek modül kapsamı sağlar ve büyük ölçüde bu kalıbın yerini alır. Ancak IIFE modüllerini anlamak, gizlilik ile kapsüllemenin nasıl çalıştığını açıklığa kavuşturur; ayrıca eski kodlarda bunlarla hâlâ karşılaşırsınız.

Hızlı Kontrol

Modül kalıbı ve IIFE'ler.

Özet

Modül kalıbı, özel bir kapsam oluşturmak için IIFE kullanır ve gizli durumu kapsayan yöntemlere sahip bir nesne döndürür. İç işleyiş özel kalır; yalnızca döndürülen üyeler geneldir. Açığa çıkaran modül kalıbı gibi çeşitler arayüzü netleştirir ve modüller tekil örnekler gibi davranır. ES import/export artık bu kalıbın yerini almıştır, ancak aynı fikirler üzerine kuruludur.

Sıkça Sorulan Sorular

“Modül Deseni (IIFE)” dersi ücretsiz mi?

Evet — “Modül Deseni (IIFE)” dersin tüm metni burada web'de ücretsiz olarak okunabilir. Etkileşimli olarak pratik yapmak (yerleşik kod editörü ve 7/24 yapay zeka koçu) ve JavaScript Academy kursunun geri kalanını açmak için CoddyKit PRO'ya yükselt. JavaScript Academy kursu toplamda 4 dersten oluşur.

“Modül Deseni (IIFE)” dersinde ne öğreneceğim?

Kodu hemen çağrılan işlevlerle kapsülleyin. JavaScript Academy ile uygulamalı kodu tarayıcıda doğrudan çalıştırarak pratik yaparsın ve 7/24 yapay zeka koçu dersi çalışırken sorularını yanıtlar.

JavaScript Academy öğrenmeye başlamak için deneyim gerekli mi?

Önceden deneyim gerekmez. CoddyKit'te JavaScript Academy, başlangıçtan ileri seviyeye kadar yapılandırıldığı için buradan başlayabilir veya başından başlayıp kendi hızında ilerleme yapabilirsin. Bu, 4 dersinin 3. dersidir.

“Modül Deseni (IIFE)” dersi ne kadar sürer?

Çoğu CoddyKit dersi yaklaşık 5–10 dakika sürer. Her biri kısa ve etkileşimli olduğu için sabit ilerleme yaparsın ve web ile uygulama arasında tam olarak bıraktığın yerden devam edebilirsin.

Bu JavaScript Academy dersinde kod yazıp çalıştırabilir miyim?

Evet. Her JavaScript Academy dersi yerleşik bir kod editörü içerir, bu sayede tarayıcıda gerçek kod yazıp çalıştırabilir ve anlık yapay zeka geri bildirimi alırsın — yerel kurulum gerekli değildir.

Bu kursun tüm dersleri

← JavaScript Academy Sayfasına Dön