محتويات الدورة

JavaScript / متوسط: الوحدات والعقود غير المتزامنة / الدرس 7

الوحدات وحدود الاعتماد الصريحة

نظّم الحساب ومحولات المتصفح بوحدات ECMAScript. تتبع التصدير المسمى والارتباط الحي وحل المسارات والتحميل الخاص بالبيئة دون خلط الحزم بصياغة اللغة.

وقت القراءة التقريبي: 4 دقيقةتاريخ مراجعة المحتوى
في هذه الصفحة

أهداف الدرس

  • قراءة عقود import/export ونطاق الوحدة.
  • تمييز الارتباطات الحية من القيم المنسوخة.
  • تشخيص افتراضات التحميل في المتصفح وNode.

الوحدة عقد بين الملفات

صدّر قدرات مقصودة قليلة وأبقِ المساعدات داخل نطاق الوحدة. تقبل وحدة التسعير سنتات وكميات صالحة، ويقرأ محول المتصفح الحقول ويعرض النتيجة، فلا يدخل document إلى السياسة المحمولة. يجب أن تطابق الاستيرادات المسماة الصادرات، والتصدير الافتراضي عقد مختلف لا مرادف عام للوحدة. لا تصدر إعداداً متغيراً لمجرد السهولة. راجع الدورات وآثار التهيئة؛ إذ ينفذ الاستيراد أعلى الملف قبل عمل المستدعي.

عقد محلول: اعتماد حساب خالص

يضع المشروع المعتاد الدالة في وحدة .js منفصلة ويستوردها بعنوان نسبي صريح في المتصفح. يستخدم المثال المكتفي بذاته عنوان data لاختبار العقد دون خادم أو حزمة. يعيد الاستيراد الديناميكي وعداً بكائن مجال أسماء، وتستخرج الخاصية المسماة الدالة المصدرة. هذه وسيلة تعليم محلية لا توصية بتضمين وحدات كبيرة في data. يظل الاستيراد الساكن أوضح للاعتمادات المعروفة عند التأليف.

javascript توضيح ESM مكتفٍ بذاته
const source = "export const total = (price, count) => price * count;";
const url = "data:text/javascript," + encodeURIComponent(source);
const { total } = await import(url);
console.log(total(125, 4));
الناتج المتوقع
500

تصدّر الدالة باسمها وتستدعى بعد اكتمال الاستيراد، ولا يعتمد الحساب على المتصفح أو Node.

تحل البيئة محدد الوحدة

تحدد ECMAScript الصياغة والربط، وتقرر البيئة كيف يصل المحدد إلى الشيفرة. يفهم المتصفح العناوين النسبية، وتحتاج أسماء الحزم المجردة خريطة استيراد أو بناء يوفر حلاً مختلفاً. تحتاج الاستجابة نوع MIME مناسباً وسياسة أصل متوافقة. تحميل صفحة HTML بديلة لمسار .js ليس خطأ صياغة الوحدة المقصودة. لدى Node قواعد للحزم والامتدادات والتوافق مع CommonJS؛ فلا تستبدل import بـrequire في المتصفح للالتفاف على عنوان غير محلول.

تلاحظ الاستيرادات الارتباطات المصدرة

الارتباط المستورد غير قابل لإعادة الإسناد من المستورد ويرى تحديثات المصدر، وليس لقطة في متغير محلي. يتغير count في مجال الأسماء بعد increment. ويمكن تعديل خصائص كائن مصدر إذا كشف العقد كائناً متغيراً؛ فلا يعني منع الإسناد ثبات الحالة. فضّل عمليات تحفظ الثوابت على تعديل سجلات مشتركة من وحدات كثيرة. قد تقرأ دورة استيراد ارتباطاً قبل التهيئة، وغالباً ما تكون إعادة المسؤوليات أوضح من ترتيب تهيئة هش.

javascript تصدير حي يلاحظ عبر مجال أسمائه
const source = "export let count = 0; export function increment() { count++; }";
const module = await import("data:text/javascript," + encodeURIComponent(source));
console.log(module.count);
module.increment();
console.log(module.count);
الناتج المتوقع
0
1

يملك المصدر إعادة الإسناد، ويرى المستورد القيمة اللاحقة لا نسخة من العدد.

جعل التهيئة والإخفاق قابلين للمراجعة

فضّل start صريحة لآثار تسجيل المستمعين على عمل خفي موزع في الاستيرادات. اجعل الاعتمادات اتجاهية: لا تحتاج قواعد المجال العارض، وقد يستخدم العارض القواعد. اختبر الصادرات وتحقق من التكامل عند المحول. ميّز عند الفشل الجلب وMIME والحل والربط والتقييم. لا يثبت التنزيل تطابق الصادرات، وقد يرمي مخطط مربوط أثناء التقييم الأعلى. حدّد أول مرحلة فاشلة قبل تغيير الصياغة أو إعداد الحزم.

الأخطاء الشائعة وإصلاحها

تعذر حل اسم حزمة مجرد في المتصفح

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

اعتبار المستورد لقطة

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

فشل دورة أثناء التهيئة

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

اختبر فهمك

1. يعيد عنوان الاستيراد 200 يحوي HTML. ماذا تفحص؟

اعرض الحل المشروح

افحص الجسم وMIME ومسار الصفحة البديلة. لا تقدم الوحدة JavaScript رغم نجاح النقل. أصلح المسار أو تقديم الملفات ثم افحص الربط والتقييم؛ فلا يصلح تغيير export المورد الخطأ.

2. أي وحدة تعتمد على document: قواعد السعر أم محول النموذج؟

اعرض الحل المشروح

يملك المحول الوصول للمستند ويستدعي قواعد السعر بمدخلات عددية صالحة. تبقى القواعد محمولة وسهلة الاختبار، ويظل تكامل المتصفح طبقة صريحة بفحوص العقد الغائبة ودورة الأحداث.

أهم ما تعلمته

  • الصياغة مشتركة والتحميل والحل عقدان للبيئة.
  • تجعل الصادرات الصغيرة والاعتمادات الاتجاهية الآثار ظاهرة.

المراجع الرسمية