Hoisting در JavaScript

Hoisting یک رفتار پیش‌فرض است که JavaScript همه تخصیص‌ها را به بالای بالا می‌برد.

تخصیص‌های JavaScript بالا برده می‌شوند

در JavaScript می‌توان از متغیر قبل از تخصیص آن استفاده کرد.

به عبارت دیگر، می‌توان از آن قبل از تخصیص استفاده کرد.

مثال 1 بامثال 2 نتایج مشابه دارند:

مثال 1

x = 5; // 5 را به x اختصاص دهید
elem = document.getElementById("demo"); // عناصر پیدا کنید
elem.innerHTML = x;                     // نمایش x در عنصر
var x; // تخصیص x

آزمایش کنید!

مثال 2

var x; // تخصیص x
x = 5; // 5 را به x اختصاص دهید
elem = document.getElementById("demo"); // عناصر پیدا کنید
elem.innerHTML = x;                     // نمایش x در عنصر

آزمایش کنید!

برای درک این موضوع، باید مفهوم "Hoisting" را درک کنید.

Hoisting یک رفتار پیش‌فرض است که JavaScript همه تخصیص‌ها را به بالای محدوده فعلی (به بالای اسکریپت فعلی یا بالای تابع فعلی) برده و بالا می‌برد.

کلیدها let و const

با let یا const متغیرها و مقادیر تعریف شده بالا برده نمی‌شوند!

لطفاً در JS Let / Const برای خواندن بیشتر در مورد let و const در اینجا بخوانید.

تعریف‌های JavaScript بالا برده نمی‌شوند

JavaScript تنها تخصیص‌ها را بالا برده و نه تعریف‌ها.

مثال 1 بامثال 2 نتایج متفاوت دارند:

مثال 1

var x = 5; // x را به 5 اختصاص دهید
var y = 7; // تعریف y
elem = document.getElementById("demo"); // عناصر پیدا کنید
elem.innerHTML = x + " " + y;           // نمایش x و y

آزمایش کنید!

مثال 2

var x = 5; // x را به 5 اختصاص دهید
elem = document.getElementById("demo"); // عناصر پیدا کنید
elem.innerHTML = x + " " + y;           // نمایش x و y
var y = 7; // تعریف y

آزمایش کنید!

آیا می‌توان گفت که در آخرین مثال y هنوز تعریف نشده است؟

این به این دلیل است که تنها تخصیص (var y) و نه تعریف (=7) به بالا برده شده‌اند.

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

مثال 2 نیز مشابه است:

مثال

var x = 5; // x را به 5 اختصاص دهید
var y;     // y را اعلام کنید
elem = document.getElementById("demo"); // عناصر پیدا کنید
elem.innerHTML = x + " " + y;           // نمایش x و y
y = 7;    // 7 را به y اختصاص دهید

آزمایش کنید!

متغیرهای خود را در بالا اعلام کنید!

Hoisting (برای بسیاری از توسعه‌دهندگان) یک رفتار ناشناخته یا نادیده گرفته شده در JavaScript است.

اگر توسعه‌دهنده hoisting را درک نکند، ممکن است برنامه شامل باگ‌ها (اشتباهات) باشد.

برای جلوگیری از باگ‌ها، همیشه تمام متغیرها را در ابتدای هر محدوده اعلام کنید.

به دلیل اینکه این روشی است که JavaScript کد را تفسیر می‌کند، این عادت خوب را حفظ کنید.

در حالت سخت‌گیرانه JavaScript استفاده از متغیرها بدون اعلام مجاز نیست.

لطفاً در فصل بعد یاد بگیرید “use strict”