Closure

Birkaç soru

Örnek olması amacıyla iki soru formülize edilecek olursa, sonrasında içsel mekanizması parça parça incelenecektir, ileride daha karmaşık sorulara cevap verebilirsiniz.

1. selamVer fonksiyonu dışarıda bulunan isim deÄŸiÅŸkenini kullanmaktadır. Fonksiyon çalıştığında, hangi isim deÄŸiÅŸkeni kullanılacaktır?

   let isim = "Ahmet";
   
   function selamVer() {
     alert("Merhaba, " + isim);
   }
   
   isim = "Mehmet";
   
   selamVer(); // "Ahmet" mi yoksa "Mehmet" mi gösterilecek?

   Böyle durumlara tarayıcı ve sunucu tabanlı geliştirmelerde oldukça sık karşılaşılır. Bir fonksiyon yaratıldığı anda değil de daha sonra çalışmak üzere programlanabilir. Örneğin bir kullanıcı aksiyonu veya ağ üzerinden istekler bu gruba girer.

   Öyleyse soru: son değişiklikleri alır mı?

2. calisanYarat diÄŸer bir fonksiyon yaratır ve bunu döner. Bu yeni fonksiyon herhangi bir yerden çaÄŸrılabilir. Peki yaratıldığı yerin dışındaki deÄŸiÅŸkenlere veya çaÄŸrılan yerin dışındaki deÄŸiÅŸkenlere veya ikisine birden eriÅŸebilecek mi?

   function calisanYarat() {
     let isim = "Mehmet";
   
     return function() {
       alert(isim);
     };
   }
   
   let isim = "Zafer";
   
   // fonksiyon yarat
   let is = calisanYarat();
   
   // çağır
   is(); // burada "Mehmet" mi yoksa "Zafer" mi gösterilecek ?

Sözcüksel ortam ( Lexical Environment )

Ne olduğunu anlamak için önce “değişken”'in tekniksel anlamı üzerinde tartışmak lazım

JavaScript’te çalışan her fonksiyon, kod bloğu bir bütün olarak “Sözcüksel Ortam” adında bir objeye sahiptir.

Bu “Sözcüksel Ortam” iki bölümden oluşur:

1. Ortam Kaydı – tüm yerel deÄŸiÅŸkenleri ve özelliklerini ( ve ek özellikleri this gibi ) tutan objedir.
2. Dış Sözcüksel Ortam’a referans genelde süslü parantezin dışındaki kod ile ilintilidir.

Öyleyse “değişken” içsel objedeki bir özelliktir, çevresel kayıtlar. “değişkeni almak veya değiştirmek” demek “o objenin özelliğini almak veya değiştirmek” demektir.

Örneğin, aşağıdaki kodda sadece bir tane Sözcüksel Ortam bulunmaktadır:

Buna evrensel sözcük ortamı denilmektedir, kodun tamamıyla alakalıdır. Tüm tarayıcılarda <script> etiketleri aynı evrensel ortamı paylaşır.

Yukarıdaki görselde, dikdörtgen ile gösterilen Çevresel Kayıt ( deÄŸiÅŸken kaynağı ) anlamına gelir ve ok iÅŸareti dışsal referanstır. Evrensel Sözcük Ortamından daha dış ortam bulunmamaktadır. Yani null dur.

AÅŸağıda let deÄŸiÅŸkenlerinin nasıl çalıştığı görsel ile açıklanmıştır:

Sağ tarafta bulunan dikdörtgenler evrensel Sözcük Ortamının çalışırkenki değişikliklerini gösterir.

1. Kod çalışmaya başladığında, Sözcüksel Ortam boştur.
2. let ifade tanımlaması görünür. Ä°lk baÅŸta bir deÄŸeri bulunmamaktadır bundan undefined olarak saklanır.
3. ifade’ye deÄŸer atanır.
4. ifade yeni bir deÄŸere referans olur.

Her şey çok basit görünüyor değil mi?

Özetlemek gerekirse:

• DeÄŸiÅŸken özel bir iç objenin özelliÄŸidir. Bu obje o anda çalışan kod, fonksiyon ile baÄŸlantılıdır.
• DeÄŸiÅŸkenlerle çalışmak aslında o objenin özellikleri ile çalışmak demektir.

Fonksiyon tanımı

Fonksiyon tanımları özeldir. let deÄŸiÅŸkenlerine nazaran çalıştırıldıklarında deÄŸil de Sözcüksel Ortam yaratıldığında iÅŸlenirler, bu da kodun baÅŸladığı zamandır.

… Ve bundan dolayı bir fonksiyon tanımından önce çağırılabilir.

AÅŸağıdaki kodda Sözcüksel Ortam baÅŸlangıçta boÅŸ deÄŸildir. say’e sahiptir çünkü bu bir fonksiyon tanımıdır. Sonrasında ifade alır ve bunu let ile tanımlar:

İç ve dış Sözcüksel Ortamlar

say() fonksiyonu çaÄŸrısı sırasında dış deÄŸiÅŸkenler çaÄŸrılır, bu olaya daha detaylı bakacak olursak.

Fonksiyon ilk çalıştığında yeni bir Sözcüksel Ortam otomatik olarak yaratılır. Bu tüm fonksiyonlar için genel bir kuraldır. Bu Sözcüksel Ortam yerel değişkenlerin tutulması ve çağrının tüm parametrelerini tutar.

say("Ahmet") fonksiyonu çalıştığı sırada Sözcüksel Ortam aÅŸağıdaki gibi olur:

Fonksiyon çağrıldığında ise iki tane sözcüksel ortam bulunmaktadır: içte olan(fonksiyon çağrısı için) ve dışta olan(evrensel):

• İçte olan sözcüksel ortam say fonksiyonunun o anki durumuna bakar, o anda tek adi degiskeni bulunmaktadır. say("Ahmet") çaÄŸrıldığından dolayı idi deÄŸiÅŸkeninin deÄŸeri "Ahmet" olur.
• Dış Sözcük Ortamı ise bu durumda Evrensel Sözcük Ortamıdır.

İç Sözcük ortamı outer ile Dış Sözcük Ortamına referans olur.

Kod değişkene ulaşmak istediğinde – önce İç Sözcük ortamında arar, daha sonra dış sözcüm ortamına bakar ve daha sonra daha dıştakine bakar bu şekilde zincirin en sonuna kadar devam eder

EÄŸer deÄŸiÅŸken hiçbir yerde bulunamazsa, sıkı modda hata verir. use strict kullanılmazsa tanımsız deÄŸiÅŸken yeni bir global deÄŸiÅŸken yaratır.

Arama olayı bizim yazdığımız kodlarda nasıl işliyor buna bakalım:

• say içindeki alert adi deÄŸiÅŸkenine eriÅŸmek istediÄŸinde, anında Sözcük Ortamında bulabilir.
• ifade’ye eriÅŸmek istediÄŸinde önce fonksiyonun içine bakar fakat orada da bulamayacağından outer referansı takip ederek evrensel sözcük ortamından bu deÄŸiÅŸkene eriÅŸebilir.

Şimdi bölümün ilk başında sorulan sorulara cevap bulunabilir.

Bir fonksiyon dışta bulunan değişkenin en son değerini alır.

Bunun nedeni tanımlanan mekanizmadan dolayıdır. Eski değişkenler bir yere kaydedilmezler. Fonksiyon bunları istediğinde iç sözcük ortamından veya dış sözcük ortamından o anki değeri alır.

Bundan dolayı ilk sorunun cevabı Mehmet olacaktır:

let adi = "Ahmet";

function selamVer() {
  alert("Merhaba, " + adi);
}

adi = "Mehmet"; // (*)

selamVer(); // Mehmet

Çalışma akışı şu şekildedir:

1. Evrensel Sözcük ortamında adi:"Ahmet" bulunmaktadır.
2. (*) satırında evrensel deÄŸiÅŸken deÄŸiÅŸir, ÅŸimdi adi:"Mehmet" bulunmaktadır.
3. selamVer() fonksiyonu çalıştığında adi deÄŸiÅŸkenini dışarıdan alır. Bu dış sözcüksel ortamda deÄŸiÅŸkenin deÄŸeri "Mehmet"tir.

İç içe fonksiyonlar

Bir fonksiyon diğer bir fonksiyon içerisinde yaratılırsa buna iç içe fonksiyon denir.

Teknik olarak bu mümkündür.

Kodu organize etmek için şu şekilde kullanabilirsiniz:

function selamYolcu(adi, soyadi) {

  // yardımcı iç içe fonksiyon.
  function tamIsim() {
    return adi + " " + soyadi;
  }

  alert( "Merhaba, " + tamIsim() );
  alert( "Güle Güle, " + tamIsim() );

}

iç içe fonksiyon tamIsim() kullanım kolaylığı saÄŸlaması amacıyla yapılmıştır. Dışta bulunan deÄŸiÅŸkenlere eriÅŸebilir ve tam ismi döndürebilir.

Daha ilginci, iç içe bir fonksiyon geri döndürülebilir: Bu yeni objenin bir özelliği olarak veya sonucun kendisi dönebilir. Sonra başka yerde kullanılabilir. Nerede olduğu önemli olmaksızın, hala aynı dış değişkene erişebilir.

Bunun örneği yapıcı ( constructor ) fonksiyondur ( Yapıcı, "new" operatörü bölümünden inceleyebilirsiniz. )

// yapıcı fonksiyon yeni bir obje dönderir.
function Kullanici(isim) {

  // obje metodu iç içe fonksiyon olarak yaratıldı.
  this.Kullanici = function() {
    alert(isim);
  };
}

let kullanici = new Kullanici("Ahmet");
kullanici.selamYolcu(); // metod dışarıda bulunan "isim" değişkenine erişebilir.

Fonksiyonun döndürülmesi örneği:

function sayacUret() {
  let sayac = 0;

  return function() {
    return sayac++; // dışarıda bulunan sayac değişkenine erişimi bulunmaktadır.
  };
}

let sayac = sayacUret();

alert( sayac() ); // 0
alert( sayac() ); // 1
alert( sayac() ); // 2

sayacUret örneÄŸine bakılacak olursa. “sayac” fonksiyonunu bir sonraki sayı ile döndürür. Basit olmasının yanında biraz modifiye edilmiÅŸ hali pratikte kullanılmaktadır pseudorandom number generator. Yani çok suni bir örnek deÄŸildir.

Peki sayaç içeride nasıl çalışmakta?

İçteki fonksiyon çalıştığında sayac++ içeriden dışarıya kadar sayac deÄŸiÅŸkenini arar. Yukarıdaki örneÄŸe bakılacak olursa, sıralama ÅŸu ÅŸekilde olacaktır:

1. İçte bulunan fonksiyonun yerel değişkenleri.
2. Dışta bulunan fonksiyonların değişkenleri.
3. …Bu evrensel değişkenlere kadar gider.

sayac örneÄŸinde 2. adımda bulundu. Dıştaki deÄŸiÅŸken deÄŸiÅŸtirildiÄŸinde, bulunduÄŸu yerde deÄŸiÅŸiklik olur. Bundan dolayı sayac++ dıştaki deÄŸÅŸikeni bulur ve dıştaki deÄŸiÅŸkenin Sözcüksel Ortamında bu deÄŸiÅŸkenin deÄŸerini deÄŸiÅŸtirir. Sanki let sayac = 1 yapıyormuÅŸ gibi.

Size iki tane sorum var:

1. sayacUret’e ait olmayan bir koddan sayac deÄŸiÅŸkeni sıfırlanabilir mi? Mesela yukarıdaki örnekte alert sonrasında.
2. EÄŸer sayacUret()'i bir kaç defa çağırırsanız – birçok sayac fonksiyonu döndürür. Bunlar birbirinden bağımsız mıdır yoksa aynı sayac’ı mı kullanılar?

Okumaya devam etmeden yukarıdaki sorulara cevap vermeye çalışın.

…Bitti mi?

Peki o zaman, ÅŸimdi cevaplar.

1. Hayır sıfırlayamaz. sayac yerel bir deÄŸiÅŸkendir ve dışarıdan eriÅŸilemez.
2. Her sayacUret çaÄŸrısı o fonksiyona ait Sözcüksel Ortam üretir, bunun da kendine ait sayac deÄŸiÅŸkeni bulunmaktadır. Öyleyse sayac deÄŸiÅŸkenleri her fonksiyon için bağımsızdır denebilir.

Örneğin:

function sayacUret() {
  let sayac = 0;

  return function() {
    return sayac++; // dışarıda bulunan sayac değişkenine erişimi bulunmaktadır.
  };
}

let sayac1 = sayacUret();
let sayac2 = sayacUret();

alert( sayac1() ); // 0
alert( sayac1() ); // 1

alert( sayac2() ); // 0 (independant)

Muhetemelen, aklınızda dış değişkenlerin nasıl çalıştığı açıklığa kavuştu. Fakat daha karmaşık olaylar için daha derine inmeye gerek var.

Detaylı şekilde ortamların incelenmesi.

Şu anda clouse’ların genel olarak nasıl çalıştığını biliyorsunuz, artık daha derinine inme vakti geldi.

AÅŸağıda sayacUret fonksiyonunun adımları gösterilmektedir, her ÅŸeyi anladığınıza emin olun. Basamaklarda göreceÄŸiniz [[Environment]] henüz iÅŸlenmedi.

1. Kod çalışmaya başkadığında sadece bir tane Sözcüksel Ortam bulunmaktadır:

   BaÅŸlangıçta sadece sayacUret fonksiyonu bulunmaktadır, çünkü bu fonksiyon tanımıdır. Henüz çalışmadı.

   Tüm fonksiyonlar baÅŸlangıçta gizli bir [[Environment]] deÄŸiÅŸkeni alırlar, bu yaratılmaya dair üretilecek Sözcüksel Ortama referans olur. Bunun hakkında henüz bilgi verilmedi, fakat teknik olarak bunu fonksiyonun nerede yaratıldığını bilmesi olarak anlayabilirsiniz.

   Burada sayacUret Evrensel Sözcüksel Ortamda yaratıldı. Bundan dolayı [[Environment]] bu ortamın referansıdır.

   DiÄŸer bir deÄŸiÅŸle fonksiyon üretildiÄŸinde Sözcüksel Ortama ait bir “baskı” ile üretilir. Bu [[Environment]] gizli bir özellik olarak burayı referans verir.

2. Sonrasında kod sayacUret() çaÄŸrısını yapıyor. AÅŸağıda sayacUret()'in ilk satırı çalıştığındaki durumu gösterilmektedir.

   sayacUret() fonksiyonu çaÄŸrıldığında, bu fonksiyonun deÄŸiÅŸkenlerini ve argümanlarını tutmak için Sözcüksel Ortam yaratılır.

   Her Sözcüksel Ortam iki şeyi tutar:

   1. Yerel deÄŸiÅŸkenlere ait Ortamsal Kayıtlar. Bu durumda let sayac çalıştırıldığında yerel deÄŸiÅŸken olarak sayac tutulmaktadır.

   2. Dış sözcüksel referans, bu fonksiyonun [[Environment]]'i dir. Burada sayacUret fonksiyonunun [[Environment]]'i evrensel sözcüksel ortama referans verir.

   Öyleyse ÅŸimdi iki tane sözcüksel ortam bulunmaktadır: evrensel olan ve sayacUret çaÄŸrısını yapan( dış referans verir).

3. sayacUret() fonksiyonu çalıştığında küçük bir iç fonksiyon yaratılır.

   Fonksiyonun nasıl yaratıldığı yani Fonksiyon Tanımıyla mı yoksa Fonksiyon Ä°fadesiyle mi yaratıldığı önemli deÄŸildir. Tüm fonksiyonlar bulunduÄŸu sözcüksel ortama referans eden [[Environment]] özelliÄŸi ile yaratılırlar. Bundan dolayı en küçük fonksiyon bile bu özelliÄŸi içerir.

   İçte olan yeni fonksiyon için [[Environment]] deÄŸiÅŸkeni var olan sayacUret’in Sözcüksel Ortamıdır.( DoÄŸduÄŸu yer )

   Dikkat ederseniz bu basamakta iç fonksiyon yaratıldı fakat çağırılmadı. İçindeki kod function() { return sayac++; } çalışmadı, bu kod döndürülecek.

4. Çalışma devam ettiÄŸinde sayacUret() biter, sonuc olarak ( küçük iç fonksiyon ) global counter deÄŸiÅŸkenine atanıyor.

   Bu fonksiyonun sadece bir satır kodu var: return sayac++, sadece bu çalışacaktır.

5. sayac() çaÄŸrıldığında, “boş” bir Sözcüksel Ortam yaratılır. hiçbir yerel deÄŸiÅŸkeni yoktur. Fakat sayac’ın [[Environment]]'i dış referans olarak kullanılır. Bundan dolayı, daha önceden yapılan sayacUret()'in deÄŸiÅŸkenlerine eriÅŸebilir. OluÅŸturulduÄŸu yer:

   DeÄŸiÅŸkene eriÅŸmesi gerekirse önce kendi yerel sözcüksel ortamına(boÅŸ), sonra daha önce çaÄŸrılan sayacUret()'in sözcüksel ortamına, en son evrensel ortama bakar.

   sayac için arama yaptığında, en yakınında sayacUret’in sözcüksel ortamı bulunmaktadır.

   Buradaki hafıza yönetimine dikkat ederseniz. sayacUret() çaÄŸrısı bittikten bir süre sonra, Sözcüksel ortam hafızada tutulur, çünkü içte bulunan fonksiyonun [[Environment]]'i sayacUret’e referans vermektedir.

   Genel olarak, sözcüksel ortam objesi fonksiyon kullanılabilir olduğu sürece yaşar. Fonksiyon kullanılmadığında silinir.

6. sayac() fonksiyonu sadece sayac deÄŸiÅŸkenini döndürmekle kalmaz, artırırda. Dikkat ederseniz deÄŸiÅŸiklik sadece “olduÄŸu yerde” yapıldı. Var olan sayac deÄŸiÅŸkeni bulunduÄŸu ortamda deÄŸiÅŸtirildi.

   Öyleyse bir önceki adıma tek deÄŸiÅŸiklikle geri dönülmektedir – sayac’ın yeni deÄŸeri. Devam eden çaÄŸrılar da aynı ÅŸekilde çalışırlar.

7. Sonraki sayac() da aynısını yapar.

Başlangıçta sorulan ikinci sorunun cevabı şimdi açıklık kazanmış olmalı.

AÅŸağıda isim özelliÄŸi calisanUret() fonksiyonu tarafından bulunduÄŸu ortamdan kullanılmıştır:

Sonuç görüşdüğü gibi "Pete" olacaktır.

…Fakat eÄŸer calisanUret() fonksiyonu içerisinde let name tanımlanmamış olsaydı, bu durumda deÄŸiÅŸkeni arayış evrensel deÄŸiÅŸkenler ile devam edecekti ve bu durumda sonuç "John" olacaktı.

Kod blokları ve döngüler, IIFE

Yukarıdaki örnekler fonksiyonlara odaklanmıştır. Fakat Sözcüksel Ortam {...} süslü parantez içerisinde de geçerlidir.

Bir kod bloğu çalıştığında oluşturulur ve blok seviyesinde yerel değişkenleri tutar. Aşağıda bir kaç örneği bulunmaktadır.

If

AÅŸağıdaki örnekte iÅŸlem blok çalıştığında if bloÄŸunun içine girer, yeni Sözcüksel Ortam “if-only” için yaratılmıştır:

Yeni sözcüksel ortam bilgileri dış çevreden alabilir, bundan dolayı ifade eriÅŸilebilirdir. Fakat if içerisindeki tüm deÄŸiÅŸkenler ve Fonksiyonel ifadeler kendi Sözcüksel Ortamdan eriÅŸilebilir, dışarıdan eriÅŸilemez.

ÖrneÄŸin if bittikten sonra kullanici deÄŸiÅŸkeni görünmez olacaktır.

For, while

Her bir döngü kendine ait Sözcüksel Ortama sahiptir. EÄŸer deÄŸiÅŸken for içerisinde tanımlanmışsa o sözcüksel ortama yereldir.

for(let i = 0; i < 10; i++) {
  // Her döngü kendisine ait sözcüksel ortama sahiptir.
  // {i: deger}
}

alert(i); // Hata, böyle bir değişken yoktur.

Bu aslında istisnadır, çünkü let i, görünürde {...} dışındadır. Fakat her döngü kendine ait sözcüksel ortamında i’nin o anki deÄŸerini içermektedir.

Döngüden sonra i görünmez olur.

Kod Blokları

“yalın” kod bloÄŸu {...} ile deÄŸiÅŸkenler “yerel kapsama” tamlanabilir.

Örneğin, bir tarayıcıda tüm kodlar evrensel alanları paylaşabilir. Eğer bir kod bloğu içerisinde evrensel alanda bir değişken yaratılırsa, kodun tamamında kullanılabilir. Fakat bu çatışmalara neden olabilir, örneğin aynı değişkenler farklı yerlerde yazılabilirler ve birbirlerinin bilgilerini silebilirler.

Bu değişken isimleri genel kullanılırsa ve kod yazan kişi diğer değişkenin kullanıldığını bilmiyor ise yaşanılacak bir olaydır.

Bunlardan kaçınmak için bir kod bloğu oluşturarak dışarıda bulunan evrensel ortamdan izole edilebilir:

{
  // yerel değişkenler ile dışarıdaki değişkenlere etki etmeden istenilen şekilde izolasyon yapılabilir.
  let mesaj = "Merhaba";

  alert(mesaj); // Merhaba
}

alert(mesaj); // Hata: mesaj tanımlı değildir.

Bloğun dışındaki kod içerideki değişkeni göremez. Çünkü bir her kod bloğu kendine ait sözcüksel ortama sahiptir.

IIFE

Eski kodları arasanız “anında çalışan fonksiyon ifadeleri” ( IIFE ) bu amaçla kullanılmıştır.

Aşağıdaki gibidirler:

(function() {

  let mesaj = "Merhaba";

  alert(mesaj); // Merhaba

})();

Burada bir fonksiyon ifadesi yaratıldı ve doğrudan çağırıldı. Kod hemen çalışır ve kendine ait değişkenlere sahiptir.

Fonksiyon ifadesi parantez içine alınmıştır (function {...}), çünkü eÄŸer JavaScript ana kod akışında "function" görürse bunu Fonksiyon Tanımı olarak algılar. Fakat Fonksiyon Tanımının ismi olmalıdır ve ismi olmadığından dolayı bu kod parantez içine alınmaz ise hata verir.

// Error: Unexpected token (
function() { // <-- JavaScript fonksiyon ismini bulamadı. ('i gördü ve hemen hata verdi.

  let mesaj = "Merhaba";

  alert(mesaj); // Merhaba

}();

“Tamam, önemli değil, hadi Fonksiyon tanımı yapmak için bir ad verelim” derseniz bu da çalışmaz. Çünkü JavaScript Fonksiyon Tanımlarının anında çalışmasına izin vermez:

// Bu defa aşağıdaki parantez hata verecektir.
function go() {

}(); // <-- Fonskyion Tanımı anında çalıştırılamaz.

…Bundan dolayı parantez bu fonksiyonun başka bir ifade kaynağında yaratıldığını ifade eder ve bu da Fonksiyon İfadesidir. İsme gerek duymaksızın doğrudan çalıştırılır.

JavaScript’e başka yollarla da Fonksiyon İfadesini belirtmek mümkündür.

//  IIFE yaratmanın yolları.

(function() {
  alert("Fonksiyon etrafındaki parantezler");
})();

(function() {
  alert("Her şeyin etrafında parantez");
}());

!function() {
  alert("Lojik NOT kapısıyla ifadenin başlaması.");
}();

+function() {
  alert("Matematiksel toplama işareti ile ifadenin başlaması.");
}();

Yukarıdaki tüm durumlarda Fonksiyon İfadesi tanımlanır ve doğrudan çalıştırılır.

Garbage Koleksiyonu

Sözcüksel Ortam objeleri aynı normal değerler gibi hafıza yönetimine konu olurlar.

• Genelde, Sözcüksel Ortam fonksiyon çalıştıktan sonra temizlenir. ÖrneÄŸin:

  function f() {
    let deger1 = 123;
    let deger2 = 456;
  }
  
  f();

  Buradaki iki deÄŸer teknik olarak Sözcük Ortamının özellikleridir. Fakat f() bittikten sonra bu Sözcük Ortamı eriÅŸilemez hale gelir, bundan dolayı hafızadan silinir.

• … Fakat f den sonra hala iç içe fonksiyon var ise [[Environment]] dıştaki sözcük ortamını canlı tutar:

  function f() {
    let deger = 123;
  
    function g() { alert(deger); }
  
    return g;
  }
  
  let g = f(); // g ulaşılabilir ise, dıştaki sözcük ortamı canlı kalır.

• EÄŸer f() birçok defa çağırılırsa ve sonuçları kaydedilirse bu kaydedilen Sözcüksel Ortam objeleri de hafızada kalır. AÅŸağıdaki 3 farklı kodda daha açık bir ÅŸekilde gösterilmiÅŸtir.

  function f() {
    let deger = Math.random();
  
    return function() { alert(deger); };
  }
  
  // Dizideki 3 fonksiyon da kendine ait sözcüksel ortama sahiptirler.
  //         LE   LE   LE
  let arr = [f(), f(), f()];

• Sözcüksel Ortam objesi eriÅŸim olmayınca ölür. Bu iç içe fonksiyonların referansı kalmadığında meydana gelir. AÅŸağıdaki kodda g eriÅŸilemez olduÄŸunda value’da hafızadan silinir.

  function f() {
    let value = 123;
  
    function g() { alert(value); }
  
    return g;
  }
  
  let g = f(); // g canlı olursa ona karşılık gelen Sözcüksel Ortam'da hayatta kalır.
  
  g = null; // şimdi hafıza temizlendi.

Gerçek-Hayat Optimizasyonu

Görüldüğü üzere, teoride bir fonksiyon hayatta olduğun sürece onun dışındaki ona bağlı değişkenler de hayatta kalır.

Pratikte ise, JavaScript motoru bunu optimize eder. Değişken kullanımını analiz eder ve eğer dışarıdaki fonksiyonun kullanılmadığı açık ise silinir.

Bunun V8 ( Chrome, Opera)'daki yan etkisi ise böyle değişkenlerin debugging sırasında da görünememesidir.

Aşağıdaki örneğin Chrome’da konsolu açarak test ediniz.

DurduÄŸunda konsolda alert(deger) komutunu yazınız.

function f() {
  let deger = Math.random();

  function g() {
    debugger; // konsolda: alert(deger) yazdırın; Böyle bir değişken bulunamamaktadır.
  }

  return g;
}

let g = f();
g();

Gördüğünüz gibi böyle bir değişken bulunamamaktadır. Teoride, erişilebilir olmalıdır fakat JavaScript motoru bunu optimize etmiştir.

Bu komik debug problemlerine neden olabilir. Bunlardan biri – beklenenin aksine aynı isme sahip dış değişkenin görülmesi:

let deger = "Sürpriz!";

function f() {
  let deger = "En yakın değer";

  function g() {
    debugger; // in console: type alert( value ); Surprise!
  }

  return g;
}

let g = f();
g();