Hoisting در جاوا اسکریپت

به نام خدا با عرض سلام و احترام خدمت شما دوستان عزیز.در ادامه آموزش جاوا اسکریت این جلسه قصد داریم به مبحث Hoisting در جاوا اسکریپت بپردازیم.با ما همراه باشید.

Hoisting چیست؟

توابعی که با استفاده از تابع اعلان تعریف می شوند به طور خودکار بالا می روند.این بدان معناست که می توان آنها را قبل از اینکه تعریف کرد فراخوانی کرد.

به عنوان مثال:

// Calling function before declaration
sayHello(); // Outputs: Hello, I'm hoisted!

function sayHello() {
    alert("Hello, I'm hoisted!");
}

// Calling function before declaration

sayHello(); // Outputs: Hello, I'm hoisted!

function sayHello() {

alert("Hello, I'm hoisted!");

}

همانطور که می بینید، ما تابع ()sayHello را قبل از تعریف آن فراخوانی کرده ایم، اما کد همچنان کار می کند.این به این دلیل است که تابع اعلان به طور خودکار در پشت صحنه به بالا می رود.

متغیر Hoisting

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

به عنوان مثال:

str = "Hello World!";
alert(str); // Outputs: Hello World!
var str;

str = "Hello World!";

alert(str); // Outputs: Hello World!

var str;

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

به عنوان مثال:

alert(str); // Outputs: undefined
var str;
str = "Hello World!";

alert(str); // Outputs: undefined

var str;

str = "Hello World!";

مثال دیگری و که رفتار hoisting متغیر را در جاوا اسکریپت نشان می دهد:

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

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

متغیر hoisting ممکن است در نگاه اول کمی گیج کننده به نظر برسد، اما اگر این نمونه ها را با دقت مرور کنید، به راحتی متوجه خواهید شد که چگونه کار می کند.

توجه: به دلیل رفتار hoisting، تعریف کردن متغیرها در بالای محدوده فعلی بهترین روش در نظر گرفته می شود. همچنین استفاده از متغیر بدون اعلان درJavaScript strict mode مجاز نیست.

خب دوستان گرامی به پایان بخش Hoisting در جاوا اسکریپت رسیدیم امیدواریم مورد توجه شما قرار گیرد.

سایر مقالات:

Event Listener در جاوا اسکریپت

Event Propagation در جاوا اسکریپت

برای امتیاز به این نوشته کلیک کنید!

[کل: 0 میانگین: 0]

اشتراک‌گذاری

متدهای قرض گرفتن در جاوا اسکریپت نوشته قبل

Closures در جاوا اسکریپت نوشته بعد

علی فرجی

علی فرجی هستم، برنامه نویس جاوا اسکریپت و ریکت با بیش از 5 سال تجربه. من عاشق برنامه نویسیم و همیشه به دنبال یادگیری چیزهای جدید هستم.همچنین یکی از بنیانگذار های سایت کدایت ، یک سایت آموزش برنامه نویسی در حوزه جاوا اسکریپت، ریکت، اندروید و ... هستم. امیدوارم بتوانم با دانش و تجربه خود به سایر برنامه نویسان کمک کنم تا در این زمینه پیشرفت کنند.