کشف پدیده بالابر در جاوا اسکریپت: چرا متغیرها و توابع می توانند خود را “بالابر” کنند؟

Hoisting در جاوا اسکریپت مفهومی است که در آن اعلان های متغیر و تابع در مرحله کامپایل به بالای محدوده مربوطه خود منتقل می شوند (یا “بالا” می شوند. این بدان معناست که ما می توانیم از متغیرها و توابع قبل از اینکه در کد خود اعلان شوند استفاده کنیم، زیرا جاوا اسکریپت به طور خودکار آن اعلان ها را به بالا “بالا” می کند.

بنابراین، برای روشن تر شدن موضوع، تصور کنید که در حال انجام یک بازی هستید. در آن بازی، تمام سلاح هایی که می توانید استفاده کنید، قبل از شروع بازی در کیف شما آماده شده اند، حتی اگر بعداً کیف خود را چک کنید. بنابراین، زمانی که در حال بازی هستید و به یک اسلحه نیاز دارید، فقط باید آن را از کیف خود بردارید بدون اینکه نگران جستجوی آن باشید.

نمونه هایی از بالا بردن

1. بالا بردن روی متغیرها با var

console.log(myVar); // Output: undefined
var myVar = 10;
console.log(myVar); // Output: 10

توضیح:

در اینجا، جاوا اسکریپت اعلان را “بالا” می کند var myVar به بالای محدوده خود، اما مقدار اولیه آن (مقدار 10) در جای اصلی خود باقی می ماند.
بنابراین، در خط اول، myVar اعلام شده است اما مقداردهی اولیه نشده است، بنابراین خروجی است undefined.

2. بالا بردن در عملکرد

myFunction(); // Output: "Hello World"

function myFunction() {
    console.log("Hello World");
}

توضیح:

تابع myFunction اعلام کرد و تمام راه را به سمت بالا برد محدودهاز جمله بدن
به همین دلیل می توانیم تماس بگیریم myFunction قبل از اعلام آن در کد

بالا بردن در let و const

متغیرهای اعلام شده با let و const هم بلند شدند، اما داخل شدند”منطقه مرده زمانی” تا زمانی که مقداردهی اولیه آنها اجرا شود. این بدان معنی است که، حتی اگر اعلان برداشته شود، نمی توانید قبل از مقداردهی اولیه به آنها دسترسی داشته باشید.

مثال let و const

console.log(myLetVar); // Error: Cannot access 'myLetVar' before initialization
let myLetVar = 20;

console.log(myConstVar); // Error: Cannot access 'myConstVar' before initialization
const myConstVar = 30;

توضیح:

در اینجا جاوا اسکریپت نیز اعلان را افزایش می دهد let myLetVar و const myConstVar به بالا محدوده آنها، اما آنها در “منطقه مرده زمانیتا زمانی که به خط اولیه آن برسد.
از این رو، دسترسی به این متغیر قبل از مقداردهی اولیه باعث خطا می شود.

دلایل استفاده از بالابر

Hoisting می‌تواند کد را انعطاف‌پذیرتر کند زیرا ما می‌توانیم توابع را در هر جایی بدون نگرانی در مورد ترتیب کد اعلام کنیم. با این حال، مهم است که به نوشتن کد تمیز و ساختاریافته ادامه دهید تا دیگران (یا خودتان) را که کد شما را می خوانند گیج نکنید.

نتیجه

• Hoisting: اعلان های متغیر و تابع در بالای محدوده خود قرار می گیرند.
• var: اعلان بالا می رود، اما مقداردهی اولیه در محل اصلی خود باقی می ماند (نتیجه می تواند تعریف نشده باشد).
• let و const: اعلامیه افزایش یافته است اما در “منطقه مرده زمانی” تا مقدار دهی اولیه (اگر قبل از مقداردهی اولیه به آن دسترسی داشته باشید، به خطا می رسد).
• عملکرد: اعلامیه و بدنه کاملاً بلند شده.

با درک مفهوم hoisting، می توانید کد جاوا اسکریپتی را بنویسید که موثرتر و عاری از باگ های مزاحم باشد. فعلا که کم و بیش است دوستان در یک مقاله دیگر می بینید!!!