Javascript Notlarım
Not: Buradaki bilgiler takip ettiğim kurs ve kaynaklardan kişisel olarak aldığım notların paylaşımıdır. Ayrıca direkt olarak çeviri içeren kısımlar da bulunabilir. Kaynakları en altta paylaşacağım. Kısaltmalar:
GEC → Global Execution Context, FEC → Function Execution Context
Execution Context
Script ilk çalıştığında JS Engine bir tane Global Execution Context oluşturur. Bu GEC Call Stack de barındırılır. GEC oluşturulurken yapılan işlemler şunlardır:
- Global object oluşturulur. (window)
- this object oluşturulur.
- Değişkenler ve fonksiyon referanslarının tutulduğu heap memory kısmı ayarlanır.
- Değişkenler undefined olarak global context içerisinde tutulur.
Örnek Kod 1 deki script ilk çalıştırıldığında ilk aşamada JS Engine GEC’i oluşturur. Soldaki resimde GEC’in oluşturulma aşamasındaki durumu gösterilir. Yukarıda maddeler halinde sıralanmış kısımları bu şekilde görebiliriz.
JS Engine her fonksiyon çağrısında (call) yeni bir Function Execution Context oluşturur. FEC, GEC e benzer. Fark olarak FEC arguments nesnesi oluşturulur ve fonksiyon parametreleri bu nesneye geçirilir.
GEC çalıştırma aşamasında ise değişkenlere değerleri atanır. Çağrılan fonksiyonlar için FEC oluşturulur, oluşturulma işlemi GEC oluşturma işlemine benzer adımları izlenir. Yine benzer şekilde çalıştırma adımları FEC de de gerçekleştirilir.
Call Stack
JS Engine Execution Context’i yönetmek için Call Stack i kullanır. Call Stack LIFO (Last In First Out) prensibiyle çalışır. Script çalıştırıldığında GEC Call Stack e push’lanır.
Function ne zaman çağrılırsa çağrılsın yeni bir FEC oluşturulur ve Call Stack e push’lanır. Bu şekilde çağrı işlemi bittiğinde, tüm FEC’ler Call Stack e push’landıktan sonra Function Execution gerçekleştirilir. Execution tamamlandıktan sonra FEC Call Stack’den çıkartılır (pop).
Call Stack Scriptin çalıştığı ortama (web tarayıcısı veya Node.js) bağlı olarak sabit boyuttadır. Bu sebeple stack boyutuna ulaşılması haline Stack Overflow durumu olacaktır. JS single-threaded programming language’dir. Bu nedenle işlemler tek bir Call Stack üzerinden gerçekleşir. Yani aynı zamanda bir işlem yapılabilir.
Clouse
Clouse konusunu yukarıdaki örnek kod üzerinden anlatmaya çalışacağım. GEC ve Call Stack konuları göz önünde bulundurduğumuzda script ilk olarak GEC üzerinde tanımlamalar yapılır.
secureFly : <f>
flight : <f>
Daha sonra ilk olarak secureFly fonksiyonu çağrılır ve FEC oluşturulur. Burada flyNumber değişkeni creation aşamasında undefined olarak tanımlanır. Execution aşamasında ise 0 değeri atanır. Daha sonra secureFly fonksiyonu tamamlandıktan sonra Call Stack’den ilgili FEC çıkartılır. flyNumber değişkeni Scope Chain üzerinde değeri tutulur. Scope Chain ise değişkenlere ulaşma imkanı sağlayan yapıdır. Buna göre chain üzerinde yukarıdaki değişkenlere ulaşabilme ihtimali verilir. (Scope Chain konusu var, let, const gibi kavramların anlaşılmasında önemli yer tutar). secureFly fonksiyonunun return kısmını ise flight değişkenine atadık. Burada yapılan işlem aslında function declaration işlemidir. Artık flight değişkeni bir fonksiyon olarak çağrılabilir. Her çağrıyla birlikte FEC oluşturulur. flight fonskiyonu işlem olarak flyNumber değerini bir artırarak console a yazdırır.
Clouse işte buradaki flyNumber tanımlandığı EC Call Stack’ten çıkarılsa dahi değişkene ulaşmamıza imkan sağlıyan yapıdır.
Bu örnekte ise bir değişkeni tek bir noktadan private olarak tanımlayıp diğer noktalarda sadece değişkeni update işlemi yapmamıza imkan vermiştir.
Buradan sonraki kısımlarda kod örnekleri üzerinden açıklamalarla devam etmeye çalışacağım.
High-Order Functions
Bir fonsiyon parametre olarak ayrı bir fonksiyon alabilir. Yine bir fonksiyon yeni bir fonksiyon dönebilir (return). Ayrıca bu iki durumu aynı anda içeren fonksiyonda olabilir. Bu tür fonskiyonlar High-Order Function olarak adlandırılır.
Short-Circuting
Javascript de öğrendiğim en güzel yapılardan birisi Short-Circuting’dir. And bağlacı ile soldan sağa doğru durumları(condition) kontrol ederek eğer tümü doğru ise en sonradaki işlem gerçekleştirilir. Şu şekilde AND işleminde tüm ifadeler doğru ise doğru değeri döner. Bunun için soldan sağa doğru durumlara bakıp karar verilir. Zaten bir durum yanlış ise AND işlemi bize false değeri verir.
IIFE (Immediately Invoken Fucntion Expression)
Tanımlandığı yerde çağrılan, bir kez işletilecek olan ve ismi olmayan fonksiyon tanımlamasıdır.
İçerisindeki variable’lara dışarıdan erişilemeyeceği için data korunmuş olacaktır. Örnek vermek gerekirse bir katsayımız olsun. Bu katsayı IIFE içerisinde tanımlansın ve bir değişken bu katsayı ile çarpıp script akışına devam edebiliriz .
Devam Edecek …
