في هذا المقالة، ستتعرف على الـ (Hoisting) في جافا سكريبت بمساعدة الأمثلة، حيث أن (Hoisting) في جافا سكريبت هو سلوك يمكن فيه استخدام دالة أو متغير قبل تعريف أي منهما.
ما هو الـ Hoisting في الجافا سكريبت
يشير (Hoisting) في جافا سكريبت إلى العملية التي يبدو من خلالها أن المترجم الفوري ينقل إعلان الوظائف أو المتغيرات أو الفئات إلى أعلى نطاقها، قبل تنفيذ الكود كالتالي:
// using test before declaring
console.log(test); // undefined
var test;
يعمل البرنامج أعلاه وسيكون الإخراج (undefined)، يتصرف البرنامج أعلاه كالتالي:
// using test before declaring
var test;
console.log(test); // undefined
كيفية استخدام Hoisting في جافا سكريبت
1. استخدام المتغيرات Variable hoisting
- بسبب الارتباك الذي يمكن أن ينتج عن استخدام (var)، فمن الأفضل تجنب استخدام المتغيرات قبل الإعلان عنها، إذا كنت تكتب رمزًا في مشروع جديد، فيجب عليك استخدام (let و const) لفرض ذلك.
- وإذا كنت تعمل في قاعدة بيانات قديمة أو كنت مضطرًا لاستخدام (var) لسبب آخر، فيجب كتابة تصريحات (var) أقرب ما يكون إلى الجزء العلوي من نطاقها قدر الإمكان، هذا سيجعل نطاق المتغيرات الخاصة بك أكثر وضوحًا.
- يمكنك أيضًا التفكير في استخدام قاعدة (ESLint no-use-before-definition) والتي ستضمن عدم استخدامك لمتغير قبل إعلانه.
2. استخدام الوظيفة Function hoisting
- يعد استخدام (Function hoisting) مفيدًا لأنه يمكننا إخفاء تنفيذ الوظيفة في مكان أبعد في الملف والسماح للقارئ بالتركيز على ما يفعله الكود، أي يمكننا فتح ملف ومعرفة ما يفعله الكود دون فهم كيفية تنفيذه أولاً، كالمثال التالي:
resetScore();
drawGameBoard();
populateGameBoard();
startGame();
function resetScore() {
console.log(“Resetting score”);
}
function drawGameBoard() {
console.log(“Drawing board”);
}
function populateGameBoard() {
console.log(“Populating board”);
}
function startGame() {
console.log(“Starting game”);
}
لاحظ أنه لدينا على الفور فكرة عما يفعله هذا الرمز دون الحاجة إلى قراءة جميع إعلانات الوظائف، ومع ذلك، فإن استخدام الوظائف قبل إعلانها هو مسألة تفضيل شخصي، يفضل بعض المطورين، تجنب ذلك ووضع الوظائف في وحدات يمكن استيرادها حسب الحاجة.
