"إذا أراد العامل أن يؤدي عمله بشكل جيد، فعليه أولاً أن يشحذ أدواته." - كونفوشيوس، "مختارات كونفوشيوس. لو لينجونج"
الصفحة الأمامية > برمجة > فهم رفع جافا سكريبت: دليل بسيط

فهم رفع جافا سكريبت: دليل بسيط

تم النشر بتاريخ 2024-11-07
تصفح:375

Understanding JavaScript Hoisting: A Simple Guide

إذا كنت جديدًا في استخدام JavaScript، فقد تواجه مواقف مربكة حيث تبدو المتغيرات غير محددة أو تظهر أخطاء مثل ReferenceError بشكل غير متوقع. يمكن إرجاع هذا غالبًا إلى مفهوم يُعرف باسم الرفع. ولكن ما هو الرفع وكيف يؤثر على التعليمات البرمجية الخاصة بك؟

في هذا الدليل، سنقوم بتفصيل مفهوم الرفع وكيفية عمله في JavaScript. في النهاية، ستفهم سبب حدوث الرفع وكيف يمكنك تجنب الأخطاء الشائعة.

ما هو الرفع؟
الرفع هو سلوك جافا سكريبت المتمثل في نقل إعلانات المتغيرات والوظائف إلى أعلى نطاقها قبل تشغيل التعليمات البرمجية. وهذا يعني أن الإعلانات (وليس المهام) تتم معالجتها أثناء مرحلة الإعداد قبل التنفيذ الفعلي للتعليمات البرمجية الخاصة بك.

تمر JavaScript بمرحلة الإنشاء أولاً، حيث تقوم بتخصيص الذاكرة للمتغيرات والوظائف. ومع ذلك، فإن الطريقة التي يتعامل بها مع الوظائف والمتغيرات مختلفة قليلاً.

وظيفة الرفع: تعريفات الرفع بالكامل
يتم رفع الوظائف المعلنة باستخدام الكلمة الأساسية function بتعريفها الكامل. يتيح لك هذا استدعاء دالة أو استخدامها قبل إعلانها الفعلي في الكود.

على سبيل المثال:


sum(5, 3); // Output: 8

function sum(a, b) {
  console.log(a   b);
}


على الرغم من أن الدالة sum() يتم استدعاؤها قبل الإعلان عنها في الكود، إلا أنها تعمل بشكل مثالي لأنه يتم رفع إعلان الدالة إلى أعلى نطاقها أثناء مرحلة الإنشاء.

الرفع المتغير: var، Let، وconst
يتصرف الرفع المتغير بشكل مختلف عن الرفع الوظيفي، ويختلف اعتمادًا على ما إذا كنت تستخدم var أو Let أو const.

1. تصريحات فار
عندما تعلن عن متغير باستخدام var، يتم رفعه إلى أعلى نطاقه بقيمة افتراضية غير محددة. هذا يعني أنه يمكنك الوصول إلى المتغير قبل الإعلان عنه، ولكن حتى تقوم بتعيين قيمة له، سيظل المتغير غير محدد.


console.log(city); // Output: undefined
var city = "New York";
console.log(city); // Output: "New York"


في هذا المثال، تم رفع المدينة بقيمة غير محددة في البداية. بمجرد تعيين القيمة "نيويورك"، يقوم console.log() الثاني بإخراج "نيويورك" بشكل صحيح.

2. تصريحات Let and Const
باستخدام Let وconst، يتم أيضًا رفع المتغيرات، لكنها تظل غير مهيأة. وهذا يعني أنك إذا حاولت الوصول إليهم قبل الإعلان عنهم، فسوف تحصل على خطأ مرجعي.


console.log(name); // ReferenceError: Cannot access 'name' before initialization
let name = "John Doe";


يحدث هذا الخطأ بسبب وجود متغيرات Let وconst في شيء يسمى المنطقة الميتة المؤقتة (TDZ) بين بداية نطاقها والنقطة التي تم الإعلان عنها فعليًا. خلال هذا الوقت، لا يمكنك الرجوع إلى المتغير.

الفرق الرئيسي بين Let و const
يتصرف كل من Let وconst بشكل مشابه من حيث الرفع، لكن const يتطلب منك تعيين قيمة أثناء الإعلان، بينما يتيح لك Let الإعلان عن متغير دون تعيين قيمة على الفور.


const name = "John Doe"; // Must be initialized
let age; // Can be declared without assignment


الرفع في الممارسة
دعونا نلقي نظرة على مثال يوضح عملية الرفع الوظيفية والمتغيرة:


console.log(city); // Output: undefined
sum(3, 4);    // Output: 7

function sum(x, y) {
  console.log(x   y);
}

var city = "New York";
console.log(city); // Output: "New York"


هنا يتم رفع الدالة المجموعية بتعريفها الكامل، بحيث يمكن استدعاؤها قبل الإعلان عن الدالة. على أية حال، تم رفع المدينة بقيمة غير محددة، وهو ما يفسر سبب إخراج الدالة console.log() الأولى غير محددة. بمجرد حدوث المهمة، يقوم console.log() الثاني بإخراج القيمة الصحيحة.

نصائح لتجنب مخاطر الرفع
لتجنب المشكلات الناجمة عن الرفع، اتبع أفضل الممارسات التالية:

  1. - استخدم Let وconst بدلاً من var لتجنب الوصول إلى المتغيرات قبل الإعلان عنها.
  2. - قم بتعريف المتغيرات والوظائف في الجزء العلوي من نطاقها للتأكد من أن التعليمات البرمجية الخاصة بك تعمل بشكل متوقع.

ملخص مفاهيم الرفع الرئيسية

  • يشير الرفع إلى سلوك JavaScript المتمثل في نقل الإعلانات إلى أعلى نطاقها قبل تشغيل التعليمات البرمجية.
  • يتم رفع الدوال المعلنة مع الدالة بتعريفاتها الكاملة، مما يسمح باستخدامها قبل الإعلان عنها.
  • يتم رفع المتغيرات المعلنة باستخدام var بقيمة افتراضية غير محددة، بينما تظل المتغيرات المعلنة باستخدام Let وconst غير مهيأة، مما يتسبب في حدوث خطأ مرجعي إذا تم الوصول إليها قبل الإعلان.
  • تنطبق المنطقة الميتة المؤقتة (TDZ) على Let وconst، مما يمنع الوصول إليهما قبل تهيئتهما.

من خلال فهم الرفع، يمكنك تجنب المشكلات الشائعة في JavaScript وكتابة تعليمات برمجية أكثر قابلية للتنبؤ بها. ومع الممارسة، ستصبح هذه المفاهيم طبيعة ثانية.

بيان الافراج تم إعادة إنتاج هذه المقالة على: https://dev.to/shubhamkhan/understanding-javascript-hoisting-a-simple-guide-59k0?1 إذا كان هناك أي انتهاك، يرجى الاتصال بـ [email protected] لحذفه
أحدث البرنامج التعليمي أكثر>

تنصل: جميع الموارد المقدمة هي جزئيًا من الإنترنت. إذا كان هناك أي انتهاك لحقوق الطبع والنشر الخاصة بك أو الحقوق والمصالح الأخرى، فيرجى توضيح الأسباب التفصيلية وتقديم دليل على حقوق الطبع والنشر أو الحقوق والمصالح ثم إرسالها إلى البريد الإلكتروني: [email protected]. سوف نتعامل مع الأمر لك في أقرب وقت ممكن.

Copyright© 2022 湘ICP备2022001581号-3