شرح صفوف ومحتوى الفقرة
اجعل خطافاتك المخصصة مركزة حول غرض عملي واضح ومحدد مثل useFetch(url) أو useDebounce(text, 250)، وتجنب ابتكار أغلفة عامة فضفاضة مثل useMount(fn) تخفي مصفوفة الاعتماديات عن أدوات الفحص وتجعل تتبع الأخطاء أصعب. يلخص الجدول التالي أهم القواعد والأنماط:
| نمط الخطاف المخصص | الوظيفة الهندسية الأساسية | بنية الإرجاع الموصى بها |
|---|---|---|
| خطاف useFetch(url) | تغليف الجلب والإلغاء بـ AbortController وحالة الطلب | كائن مسمى: { data, status, error } |
| خطاف useLocalStorage | حفظ تفضيلات العرض غير الحساسة بأمان | مصفوفة ثنائية: [value, setValue] |
| خطاف useDebounce | تهدئة القيم النصية سريعة التغير قبل الجلب | القيمة المستقرة المفردة بعد المهلة |
| دالة formatCurrency | دالة تنسيق نقية لا تستدعي أي خطاف بداخلها | دالة عادية لا تبدأ ببادئة use |
خلاصة المعرفة ومحطة الانتقال
ملخص الدرس
حصاد الدرسمراجعة مركّزة لأهم المفاهيم والقواعد الهندسية التي أتقنتها في هذا الدرس قبل التطبيق العملي
ماذا تعلّمت في هذا الدرس؟
تعلّمت في هذا الدرس استخلاص المنطق التفاعلي المتكرر في خطافات مخصصة تلتزم ببادئة use الإلزامية، وتحققت عملياً من عزل حالة كل مكون، وبنيت خطافات useFetch وuseLocalStorage وuseDebounce القابلة لإعادة الاستخدام. الخطوة التالية: انتقل الآن إلى الدرس رقم 42 «فهم أسباب إعادة التصيير وقياس الأداء في React» لمواصلة البناء التراكمي المتدرج في مسار React الحديث.