Hoisting

"Hoisting" JavaScriptdə dəyişənlərin, funksiyaların və klasların elan olunmasının bir növ skopun başlanğıcına aparılması prosesinin adıdır.

Aşağıdakı kod nümunəsinə baxaq. 1-ci nümunədə developerin kodu necə yazdığını görürük. "Hello world" çap olunduğu hissələr sadəcə dəyişən yaradılması prosesindən əvvəldə kod olması məqsədi ilə ordadır, "hoisting" prosesini başa düşmək üçün əhəmiyyətli deyil.

Düşünək ki, belə bir kod bloku ilə tanış olmusunuz və sizdən kod icra olunan zaman 4 cü sətirdəki funksiyanın nəyi çap etməsini bilməyiniz sizin kodu inkişaf etdirməyiniz üçün vacibdir.

console.log("Hello world");
console.log("Hello world");
console.log("Hello world");
console.log(a);
var a = 8;
console.log(a);

"Hoisting" prosesindən məlumatı olmayan developerlər bu koda baxdıqda onu yuxarıdakı kod bloku kimi görəcəklər və cavab olaraq, böyük ehtimalla, 3 "Hello world" strinqindən sonra 8 rəqəminin çap olunması cavabını verəcəklər.

"Hoisting" prosesilə tanış olan developerlər isə bu kodu öz mental modellərində aşağıdakı kimi quracaqlar və rahatlıqla undefined çap olunması cavabını verəcəklər.

var a;
console.log("Hello world");
console.log("Hello world");
console.log("Hello world");
console.log(a);
a = 8;
console.log(a);

"Hoisting" prosesi bizdən funksiya (function declartion), klass və "var" açarsözü ilə yaradılan dəyişənlər üçün mental modelimizi 2-ci nümunədəki kimi qurmağımızı tələb edir.

"Hoisting" proses ilə ətraflı tanış olaq.

JavaScriptdə "Hoisting"

Bir çox developer "Hoisting" yuxarıda izah etdiyim kimi başa düşür və kodu bu formada yazır. Lakin reallıqda JavaScriptdə "Hoisting" kodu yuxarı hərəkət etdirmir. Bunun yerinə kod icra olunmazdan əvvəl "Creation Phase" adlı bir proses baş tutur, bu proses zamanı hər bir funksiya, dəyişən, klasa görə "variable enviroment"də yer ayrılır və dəyəri "undefined"a və ya funksiyaya bərabər edilir.

Gəlin bu hallara daha yaxından baxaq.

Function declartion hoisting

Funksiyalar (function declarations) JavaScriptdə "hoisting" prosesinə məruz qalır və ilkin dəyəri elə funksiyanın özünə bərabər olur. Bu o məna verir ki, biz o funksiyanı yaratdığımız yerdən əvvəldə də tam olaraq istifadə edə bilərik.

sum(5, 4);

function sum(a, b) {
  const c = a + b;
  console.log(c);
  return c;
}

Başqa proqramlaşdırma dilləri ilə təcrübəsi olan bəzi developerlər yuxarıdakı kod blockunun xətaya səbəb oldduğunu düşünə bilərlər. "Hoisting" konsepti JavaScriptdə olmasa idi, burda da eyni nəticəni görə bilərdik.

var açar sözü ilə dəyişən yaratma zamanı hoisting

"var" açar sözü ilə yaradılan dəyişənlər də hoisting-ə məruz qalır və ilkin dəyəri "undefined"a bərəbar olur.

console.log(a)
var a= 7

let və const açar sözü ilə dəyişən yaratma zamanı hoisting

"let" və "const" açar sözü ilə yaradılan dəyişənlər hoisting prosesinə məruz qalmır və onları elan etdiyimiz sətirdən yuxarıda istifadə edəriksə, bu zaman xəta ilə qarşılaşacağıq.

console.log(a) //Uncaught ReferenceError: Cannot access 'a' before initialization
let a= 7

console.log(a) //Uncaught ReferenceError: Cannot access 'a' before initialization
const a= 7

Texniki olaraq "let" və "const" açar sözü ilə yaradılan dəyişənlər də hoisting olunur və dəyəri "initialized"a bərabər olur, lakin bu dəyişənlərin

Əvvələ qayıt:

Closure Scope

Növbəti:

JavaScriptdə obyekt destructuring