JavaScript: Stack & Heap

8 min readAug 18, 2024

JavaScript’in bellek yönetimi açısından iki kritik kavramı vardır:

Stack (yığın) ve Heap (küme). Peki, stack ve heap nedir? Bu yazıda, bu kavramları inceleyecek ve JavaScript’in bellek yönetimi üzerinde nasıl etkili olduklarını adım adım ele alacağız.

Stack Nedir?

Stack (Yığın), bilgisayar bilimlerinde kullanılan temel veri yapılarından biridir ve JavaScript motoru tarafından fonksiyon çağrılarını ve yerel değişkenleri yönetmek için kullanılır. Stack yapısı, Last In — First Out (LIFO) yani “Son Giren İlk Çıkar” mantığıyla çalışır. Bu veri yapısında, son eklenen öğe ilk önce işlem görür ve bu yapıyı genellikle bir kitap yığını olarak düşünebiliriz: Yeni bir kitap eklediğinizde, en üste koyarsınız ve ilk alacağınız kitap da en üstteki olacaktır. JavaScript’te, her fonksiyon çağrıldığında bir “Call Stack” oluşur ve bu fonksiyon yığına eklenir. Fonksiyon çalışması tamamlandığında, yığından çıkarılır. Örneğin, bir fonksiyon başka bir fonksiyonu çağırdığında, bu çağrı yığının en üstüne eklenir ve işlemler tamamlandıkça sırayla yığından çıkarılır. Yığının aşırı doldurulması sonucunda “Stack Overflow” adı verilen bir hata oluşabilir. Ayrıca, JavaScript motorunda Call Stack’in sınırlı bir kapasitesi vardır; aşırı derin veya sonsuz çağrılarda bu kapasite aşılabilir ve program çökebilir. Şimdi, stack’in nasıl çalıştığını ve fonksiyon çağrıları sırasında nasıl yönetildiğini inceleyelim.

Stack’in İşleyişi

Stack yapısı özellikle fonksiyon çağrılarının ve yürütme bağlamlarının yönetiminde hayati bir rol oynar. Bir fonksiyon çağrıldığında, o fonksiyonun tüm yerel değişkenleri, parametreleri ve yürütme bağlamı stack’e eklenir. Bu işlem, fonksiyonun bir “stack frame” (yığın çerçevesi) oluşturması olarak adlandırılır. Stack frame, fonksiyonun çalışması süresince gerekli olan tüm verileri içerir. Fonksiyon tamamlandığında, bu frame stack’ten kaldırılır ve bellekten serbest bırakılır, böylece diğer fonksiyon çağrıları için bellek alanı yeniden kullanılabilir hale gelir.

Bu süreç aşağıdaki adımlarla işler:

Fonksiyon Çağrısı: Bir fonksiyon çağrıldığında, o fonksiyonun parametreleri, yerel değişkenleri ve fonksiyonun geri döneceği adres gibi kritik bilgiler stack’e eklenir. Bu bilgiler, fonksiyonun nasıl ve nerede çalışacağını belirleyen yürütme bağlamını oluşturur.
Fonksiyonun Çalışması: Fonksiyon çalıştıkça, bu yerel değişkenler ve geçici veriler stack frame içinde tutulur. Fonksiyon çalıştığı sürece, bu veriler stack üzerinde kalır ve gerekli işlemler bu veriler üzerinden yapılır.
Fonksiyonun Tamamlanması: Fonksiyonun çalışması sona erdiğinde, o fonksiyona ait stack frame, stack’ten kaldırılır. Bu, bellekte fonksiyonun kapladığı alanın serbest bırakılması anlamına gelir, böylece bu alan diğer fonksiyon çağrıları için kullanılabilir hale gelir. Bu süreç, JavaScript’in bellek yönetimi ve yürütme düzeni açısından oldukça önemlidir ve programın verimli çalışmasını sağlar.

Bu sistem, fonksiyonların sırasıyla ve düzgün bir şekilde çalıştırılmasını garanti eder, ancak aynı zamanda stack’in dolma riski olan “Stack Overflow” gibi hatalara karşı da hassastır. Bu nedenle, özellikle rekürsif fonksiyonlar yazarken dikkatli olunmalıdır. Stack’in bu işleyişi, özellikle fonksiyon çağrıları ve yürütme sıralarının yönetimi açısından kritik öneme sahiptir. Peki, neden stack bu kadar yaygın bir şekilde kullanılır? Bir sonraki bölümde bu sorunun cevabını ele alacağız

Rekürsif(recursive) Fonksiyonlar: Bir fonksiyonun doğrudan veya dolaylı olarak kendisini çağırdığı durum.

Neden Stack Kullanılır?

Stack, özellikle fonksiyon çağrılarının sırasını ve geçici verilerin yönetimini sağlamak için ideal bir veri yapısıdır. Bu yapı, fonksiyonların çağrılma sırasını düzenli bir şekilde takip eder ve her bir fonksiyonun çalışırken ihtiyaç duyduğu verilere doğru zamanda erişebilmesini sağlar. Özellikle iç içe fonksiyon çağrılarında, stack her bir fonksiyonun yürütme bağlamını hatırlayarak, her fonksiyonun doğru verilerle çalışmasını ve tamamlandığında doğru sırayla geri dönmesini garanti eder.

Örneğin, bir fonksiyon başka bir fonksiyonu çağırdığında, ilk fonksiyonun durumu stack’te saklanır. İkinci fonksiyon çalıştıktan sonra, stack üzerindeki önceki durum geri yüklenir ve ilk fonksiyon kaldığı yerden devam eder. Bu, karmaşık çağrı zincirlerinde bile kodun doğru ve tutarlı bir şekilde çalışmasını sağlar. Stack, bu nedenle fonksiyonlar arasında geçişlerin güvenli ve verimli bir şekilde yapılmasını temin eder, bu da yazılımın hatasız ve beklenen şekilde çalışmasını sağlar. Ancak, stack’in sınırlı kapasitesi bazı sorunlara yol açabilir. Şimdi, stack’te oluşabilecek bu potansiyel sorunlara bir göz atalım.

Stack’te Oluşabilecek Bazı Sorunlar

Stack yapısının sınırlı bir boyutu vardır ve bu sınırlı boyut, özellikle “stack overflow” gibi sorunlara yol açabilir. Stack overflow, bir fonksiyonun çok fazla kez rekürsif olarak çağrılması veya bir döngü içinde sürekli olarak kendini çağırması durumunda meydana gelir. Bu tür bir durumda, stack’in kapasitesi aşılabilir ve program çalışmayı durdurarak bir hata verebilir.

function recursiveFunction() {
    recursiveFunction(); // Fonksiyon kendini sonsuz bir döngüde çağırıyor
// Uncaught RangeError: Maximum call stack size exceeded hatası
}

recursiveFunction();

Bu kodda, recursiveFunction fonksiyonu kendini sürekli olarak çağırır ve her çağrı stack'e yeni bir giriş ekler. Ancak bu işlem sonsuz bir döngüde devam ettiği için stack dolmaya başlar. Stack'in kapasitesi sınırlı olduğundan, bir noktada JavaScript motoru "Maximum call stack size exceeded" hatası vererek programın çalışmasını durdurur. Bu, stack overflow hatasının tipik bir örneğidir ve genellikle rekürsif fonksiyonlar yazarken ortaya çıkabilecek bir sorundur.

Stack overflow, programın çökmesine veya beklenmedik davranışlar sergilemesine neden olabilir. Bu nedenle, rekürsif fonksiyonlar yazarken, bir sonlandırma koşulu eklemek ve sonsuz döngülerden kaçınmak bu tür hatalardan korunmak için önemlidir. Stack’in potansiyel sorunlarını ele aldıktan sonra, JavaScript’teki diğer önemli bellek yönetimi yapısı olan heap’i inceleyelim.

Heap Nedir?

Heap (Küme), stack’ten farklı olarak dinamik bellek tahsisi için kullanılan ve program çalıştıkça büyüyebilen bir veri yapısıdır. Heap, bellek yönetimi açısından daha esnek ve karmaşık bir yapıya sahiptir. Genellikle büyük veri yapılarının, nesnelerin ve sınıfların saklanması için kullanılır. Stack’in aksine, heap’in boyutu sabit değildir ve programın ihtiyaçlarına göre genişleyebilir. Bu nedenle, heap, büyük ve karmaşık veri yapıları için ideal bir depolama alanıdır ve bellek yönetimi sürecinde önemli bir rol oynar.

Heap’in dinamik yapısı, bellek tahsisini ve serbest bırakılmasını geliştiricinin kontrol etmesine olanak tanır, ancak bu aynı zamanda daha dikkatli yönetilmesi gerektiği anlamına gelir. Stack’e göre daha büyük olan heap, esneklik sağlarken, bellek sızıntıları ve yönetim zorlukları gibi potansiyel riskleri de beraberinde getirir. Bu sebeple, heap üzerinde bellek yönetimi yapılırken dikkatli olunması ve uygun bellek yönetimi tekniklerinin kullanılması önemlidir. Heap’in ne olduğunu öğrendik. Şimdi, heap’in işleyişine ve JavaScript’te nasıl kullanıldığına daha yakından bakalım.

Heap’in İşleyişi

Heap, stack gibi belirli bir sıraya göre çalışmaz; yani Last In — First Out (LIFO) mantığıyla işlemez. Heap’te bellek blokları, ihtiyaç duyuldukça rastgele bir sırada tahsis edilir ve programın çalışması süresince dinamik olarak yönetilir. Geliştirici, heap üzerinde bir veri yapısı oluşturduğunda, JavaScript motoru bu veri için uygun bellek alanını heap’ten ayırır. Bu alan, artık kullanılmadığında veya referans edilmeyen bir veri haline geldiğinde, otomatik bellek yönetimi (Garbage Collection) tarafından serbest bırakılır. Bu esnek yapı, dinamik ve uzun ömürlü veri yapılarına uygun bellek yönetimi sağlar.

Bu süreç aşağıdaki adımlarla işler:

Bellek Tahsisi: Bir obje veya veri yapısı oluşturulduğunda, JavaScript bu veriyi heap üzerinde depolar. Heap, özellikle büyük ve dinamik olarak değişen verilerin saklanması için idealdir. Örneğin, bir obje oluşturulduğunda, bu objeye ait bellek alanı heap’ten tahsis edilir ve bu alan, objenin yaşam döngüsü boyunca kullanılabilir.
Referanslar: JavaScript’te, heap üzerinde saklanan verilere genellikle referanslar aracılığıyla erişilir. Bu referanslar, stack üzerinde saklanır. Yani, bir obje tanımlandığında, bu objenin adresi (referansı) stack’te tutulurken, objenin kendisi ve içerdiği veriler heap’te bulunur. Bu sayede, farklı fonksiyonlar ve kod parçaları, aynı heap üzerindeki veriye referans aracılığıyla erişebilir.
Bellek Yönetimi: Heap üzerinde tahsis edilen bellek, JavaScript motoru tarafından genellikle otomatik bellek yönetimi (garbage collection) ile yönetilir. Garbage Collector, kullanılmayan veya artık referans edilmeyen objeleri tespit ederek, bu objelerin kapladığı bellek alanını serbest bırakır. Bu işlem, bellek sızıntılarını önlemeye ve heap’te yeni veriler için yer açmaya yardımcı olur. Bu otomatik bellek yönetimi, geliştiricilerin bellek tahsisi ve serbest bırakma işlemleriyle uğraşmadan dinamik veri yapılarını rahatça kullanabilmelerini sağlar.

Heap’in dinamik yapısı, bellek yönetiminde bazı avantajlar sağlarken, aynı zamanda dikkat edilmesi gereken bazı zorlukları da beraberinde getirir. Peki, neden heap kullanılır? Bir sonraki bölümde bu sorunun cevabını inceleyeceğiz.

Neden Heap Kullanılır?

Heap, büyük, dinamik ve uzun ömürlü veri yapılarını yönetmek için idealdir. Stack, geçici ve küçük veri yapılarının hızlıca depolanması için kullanılırken, heap, boyutu ve yaşam süresi önceden kestirilemeyen, daha karmaşık ve büyük veri yapıları için tercih edilir. Bu nedenle, heap, nesneler ve diziler gibi daha büyük veri yapılarının esnek bir şekilde yönetilmesine olanak tanır.

Örneğin, bir dizi (array) veya obje oluşturduğunuzda, bu veriler heap üzerinde saklanır çünkü boyutları ve yaşam süreleri programın ilerleyen aşamalarında değişebilir. Stack’in sınırlı boyutu ve geçici doğası, bu tür büyük ve dinamik verilerin depolanması için uygun değildir. Heap ise bellek yönetiminde bu esnekliği sağlayarak, uygulamanın çalışma süresi boyunca bellek ihtiyacını karşılar ve verilerin dinamik olarak yönetilmesine olanak tanır.

Heap, ayrıca, bellek tahsisini ve serbest bırakılmasını geliştiricinin kontrol etmesine izin verirken, Garbage Collection gibi otomatik bellek yönetimi mekanizmaları sayesinde bellek sızıntılarının önlenmesine de yardımcı olur. Bu, özellikle karmaşık ve uzun süre çalışan uygulamalar için önemli bir avantajdır, çünkü heap üzerinde dinamik bellek yönetimi sayesinde bellek kullanımını optimize etmek mümkün olur.

Heap’te Oluşabilecek Bazı Sorunlar

Heap, büyük ve dinamik verilerin yönetiminde esneklik sağlasa da, bu yapı bazı potansiyel sorunları da beraberinde getirir. Heap’in karmaşık yapısı ve dinamik bellek yönetimi, dikkat edilmediğinde performans problemlerine ve bellek sızıntılarına yol açabilir.

Bellek Sızıntıları (Memory Leaks)

Heap’te en yaygın sorunlardan biri bellek sızıntılarıdır. Bellek sızıntısı, bir programın artık kullanılmayan verileri serbest bırakmaması durumunda ortaya çıkar. Bu durumda, heap üzerinde gereksiz bellek alanı işgal edilir ve bu, programın zamanla daha fazla bellek tüketmesine neden olur. Bellek sızıntıları, özellikle uzun süre çalışan uygulamalarda ciddi performans sorunlarına yol açabilir.

Örnek: Bir obje oluşturulup kullanıldıktan sonra ona referans veren değişkenlerin temizlenmemesi, o objenin hala heap’te yer kaplamasına neden olur. JavaScript motoru, bu tür kullanılmayan objeleri tespit edemeyebilir ve bu da bellek sızıntısına yol açar.

Fragmentasyon

Heap üzerinde bellek tahsisi ve serbest bırakma işlemleri dinamik olarak gerçekleştiği için zamanla “fragmentasyon” oluşabilir. Fragmentasyon, kullanılabilir bellek bloklarının küçük parçalara ayrılması ve bu parçaların verimli bir şekilde kullanılamaz hale gelmesi anlamına gelir. Bu durum, heap’te yeterli toplam boş bellek olmasına rağmen, büyük bir veri yapısı için uygun bir bellek bloğu bulunamamasına neden olabilir. Bu da programın performansını olumsuz etkileyebilir.

Garbage Collection Gecikmeleri

JavaScript gibi otomatik bellek yönetimi (Garbage Collection) kullanan dillerde, Garbage Collector, kullanılmayan objeleri temizlemek için belirli aralıklarla heap’i tarar. Ancak bu işlem, özellikle büyük ve karmaşık uygulamalarda zaman alabilir ve bu süreçte performans düşüşlerine yol açabilir. Garbage Collector, yoğun bellek temizleme işlemleri sırasında uygulamanın kısa süreliğine duraksamasına neden olabilir, bu da kullanıcı deneyimini olumsuz etkileyebilir.

Heap Overflow

Tıpkı stack’te olduğu gibi, heap’in de bir sınırı vardır. Bir uygulama, heap üzerinde çok fazla bellek tahsis ettiğinde ve bu sınırı aştığında “heap overflow” olarak adlandırılan bir durum ortaya çıkar. Heap overflow, genellikle büyük veri yapılarını işleyen veya aşırı derecede bellek tüketen uygulamalarda görülebilir. Bu durum, programın çökmesine veya performansın ciddi şekilde düşmesine neden olabilir.

Stack Exammples:

Fonksiyon Çağrıları ve Yerel Değişkenler:

function add(a, b) {
    let sum = a + b; // 'sum' değişkeni stack üzerinde saklanır
    return sum;      // Fonksiyonun sonucu olarak 'sum' döndürülür
}

let result = add(5, 10); // 'add' fonksiyonu çağrılır ve stack'e eklenir
console.log(result);      // Sonuç olan 15, konsola yazdırılır

add fonksiyonu iki parametre alır (a ve b) ve bu parametrelerin toplamını sum değişkeninde saklar. sum değişkeni stack üzerinde tutulur. add fonksiyonu tamamlandığında, sum stack'ten kaldırılır ve bellek serbest bırakılır.

Rekürsif Fonksiyonlar:

function factorial(n) {
    if (n <= 1) {
        return 1;
    }
    return n * factorial(n - 1); // factorial fonksiyonu tekrar stack'e eklenir
}

let result = factorial(5);
console.log(result); // 120

factorial fonksiyonu her çağrıldığında stack üzerinde yeni bir giriş (frame) oluşturulur. Rekürsif çağrılar tamamlandıkça bu girişler stack'ten kaldırılır.

Heap Examples:

Nesne (Object) Oluşturma:

let person = {
    name: "John",
    age: 30
};

person nesnesi heap üzerinde saklanır çünkü nesneler büyük ve dinamik veri yapılarıdır. person nesnesinin referansı stack üzerinde saklanır, ancak nesnenin kendisi heap'te yer alır.

Dizi (Array) Oluşturma:

let numbers = [1, 2, 3, 4, 5];

numbers dizisi heap üzerinde saklanır. Dizi elemanlarının miktarı ve dizinin boyutu değişebilir, bu nedenle heap kullanılır. numbers dizisinin referansı stack üzerinde tutulur.

Nesnelerin Dinamik Olarak Oluşturulması:

function createPerson(name, age) {
    return {
        name: name,
        age: age
    };
}

let person1 = createPerson("Alice", 25);
let person2 = createPerson("Bob", 28);

createPerson fonksiyonu her çağrıldığında yeni bir nesne heap üzerinde oluşturulur. Bu nesnelerin referansları person1 ve person2 değişkenlerinde stack üzerinde saklanır.

Bu yazıyı okuduğunuz için teşekkür ederim! Stack ve heap konularını ele aldığımız bu incelemede, JavaScript’in bellek yönetimi hakkında daha derin bir anlayış kazanmanızı umuyorum. Bir sonraki yazımda görüşmek üzere :).