در این بخش از سری آموزش جاوا اسکریپت قصد داریم در مورد م Hoisting در جاوا اسکریپت صحبت کنیم.
Hoisting در جاوا اسکریپت چیست
Hoisting در واقع به یک رفتار پیش فرض زبان جاوا اسکریپت اطلاق می گردد. این رفتار عبارتند از انتقال خودکار تعریف متغیر (variable declaration) به بالای حوزه (scope) جاری.
در جاوا اسکریپت این امکان وجود دارد که یک متغیر را پیش از اینکه تعریف شود بکار برد. به عبارتی دیگر می توان متغیر را مورد استفاده قرار داده، بعدا آن را تعریف کرد.
اگر معنای Hoisting رو بررسی کنیم، خواهیم دید که آن را به بالا بردن معنا کردند. پس می شود اینطور برداشت کرد که دیگر مهم نیست ما کجا متغیرها و توابع رو تعریف یا Declare می کنیم، آنها به بالای Scope خودشان که حالا یا میتواند global یا سراسری و local یا محلی باشه، انتقال داده می شوند.
اگر چه باید این را هم در نظر بگیرید که این مکانیزم فقط تعاریف یا Declaration رو بالا میبرد و Assignment و جاهایی که مقداری را به متغیر نسبت دادیم، سر جای خودشان باقی میمانند.
Hoisting توابع
توابعی که با اعلان function تعریف می شوند, بصورت خودکار Hoist می شوند یا در اسکوپ به بالا منتقل می شوند به این معنا که می توانید آن را قبل از تعریف, صدا زده می شوند.
|
1 2 3 4 5 6 |
// Calling function before declaration sayHello(); // Outputs: Hello, I'm hoisted! function sayHello() { alert("Hello, I'm hoisted!"); } |
همانطور که می بینید, ما تابع sayHello() را قبل از تعریف صدا زدیم اما با این حال کد کار می کند. به این دلیل که اعلان function در پشت صحنه آن را به بالا انتقال داده است.
Hoisting متغییر
مشابه آن, اعلان متغیر آن را به صورت خودکار به بالای اسکوپ فعلی منتقل کرده است. به این معنی که اگر متغیر داخل بلاک تابع تعریف شود, به بالای تابع منتقل می شود, اما اگر خارج از تابع تعریف شود, به بالای اسکریپت منتقل می شود و بصورت سراسری در دسترس خواهد بود.
|
1 2 3 |
str = "Hello World!"; alert(str); // Outputs: Hello World! var str; |
به هر حال, جاوا اسکریپت فقط اعلان ها را hoist یا بالا می برد نه مقداردهی شده ها را. به این معنی که اگر متغیر تعریف و بعد از استفاده مقدار دهی شده باشد, مقدار آن undefined خواهد بود.
|
1 2 3 |
alert(str); // Outputs: undefined var str; str = "Hello World!"; |
یک مثال دیگر از رفتار hoisting متغیر را ببینید :
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
var i = 1; // Declare and initialize i alert(i + ", " + j); // Outputs: 1, undefined var j = 2; // Declare and initialize j var x = 5; // Declare and initialize x var y; // Declare y alert(x + ", " + y); // Outputs: 5, undefined y = 10; // Initialize y var a = 3; // Declare and initialize a b = 6; // Initialize b alert(a + ", " + b); // Outputs: 3, 6 var b; // Declare b var u = 4; // Declare and initialize u alert(u + ", " + v); // Outputs: 4, undefined var v; // Declare v v = 8; // Initialize v |
بالا بردن (hoist) متغیرها شاید در نگاه اول گیج کننده باشد, اما اگر مثال های بالا را با دقت بررسی و خودتان تست کنید, به راحتی نحوه کار کردن آن را درک می کنید.
نکته: استفاده از متغیر بدون تعریف آن در حالت Strict Mode که در بخش بعدی آن را یاد می گیریم, قابل قبول نیست.
امیدواریم در این بخش آموزش جاوا اسکریپت, از آموزش Hoisting در جاوا اسکریپت نهایت استفاده را برده باشد.
هر سوالی داشتید ، از قسمت نظرات ارسال کنید . سریعا ، پاسخگوی سوالات شما هستیم .
موفق باشید.
