Javascript dilinin nasıl yorumlandığı ile alakalı bir durum olan Hoisting kavramını bilmekte fayda var diye düşünüyorum. Örneğin aşağıdaki gibi bir kod yazdığımızda;

console.log(username);
var username = "aykuttasil";

alacağımız çıktı undefined şeklinde olur. Normal şartlarda beklediğimiz sonuç hata fırlatmasıdır. Çünkü username değişkeni tanımlanmadan önce yazdırılmaya çalışılmıştır. Ama beklediğimiz şekilde olmaz ve ekrana undefined yazılır.

Peki Neden?

Yukarıdaki gibi bir kod bloğu çalıştırılmadan önce javacsript tarafından hoisting işlemi uygulanır ve tüm var değişkenleri kod bloğunun(scope) en üstüne taşınır ve default olarak undefined atanır. Yani aslında kod aşağıdaki hale dönüşür:

var username = undefined;
console.log(username);
username = "aykuttasil";

Bu nedenle ekrana undefined yazılır. Yani username değişkeni diye bir değişken var ama henüz bir değer ataması yapılmamış.

Peki ne yapmak gerekir?

Javascript yazarken çok dikkatli oluyoruz :D Ve bu sorunu çözmek için ES2015(ES6) ile birlikte gelen let ve const tipinde değişken oluşturmaya özen gösteriyoruz.


Bir de şuraya let,const ve var değişken farkları ve hosting işlevini özetleyen maddeleri bırakalım.

  • var declarations are globally scoped or function scoped while let and const are block scoped.
  • var variables can be updated and re-declared within its scope; let variables can be updated but not re-declared; const variables can neither be updated nor re-declared.
  • They are all hoisted to the top of their scope. But while var variables are initialised with undefined, let and const variables are not initialised.
  • While var and let can be declared without being initialised, const must be initialised during declaration.

Kaynaklar