عمليات استيراد ES6 المتغيرة

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

الواردات الثابتة

لسوء الحظ، يتم تحليل بيان الاستيراد في ES6 بشكل ثابت. وهذا يعني أن الوحدات التي يتم استيرادها يجب أن تكون معروفة في وقت الترجمة. ومن ثم، لا يمكنك استخدام أسماء المتغيرات لتحديد الوحدات المراد استيرادها.

Loader API

لتحميل الوحدات ديناميكيًا، تحتاج إلى استخدام Loader API. توفر واجهة برمجة التطبيقات هذه وظيفة تسمى System.import() التي تقبل سلسلة تحدد الوحدة المراد تحميلها. يوضح المثال التالي كيف يمكنك استخدامه لتحميل وحدة بناءً على اسم متغير:

System.import('./utils/'   variableName).then(function(module) {
  console.log(module);
});

ترجع الدالة System.import() وعدًا يتم حله للوحدة المحملة. يمكنك بعد ذلك الوصول إلى أعضاء الوحدة المصدرة باستخدام كائن الوحدة.

اعتبارات التوافق

يتم دعم واجهة برمجة تطبيقات Loader في المتصفحات الحديثة وNode.js. ومع ذلك، قد تحتاج إلى استخدام polyfill لتحقيق التوافق مع المتصفحات الأقدم.