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

وحدات

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

Modules

  • تم استخدام نمط الوحدة قبل وحدات ES6.
  • الهدف: تغليف الوظائف ودعم البيانات الخاصة وكشف واجهة برمجة التطبيقات العامة ويتم تحقيق كل هذا باستخدام IIFEs.

IIFE : السابقين. (وظيفة(){})()؛

// IIFE Goal: Create a new scope, return the data just once. All of data inside IIFE will be private as it would inside the fn scope. 
// Using this way, we don't need to call it separately. And it ensures its called only once.
// IIFE is created only once, goal is 'NOT TO REUSE' by executing it multiple times.

// Result of running an IIFE is stored, or else it will disappear simply.
const ShoppingCart2 = (function(){
  const cart = [];
  const shippingCost = 10;
  const totalPrice = 237;
  const totalQuantity = 10;

  const addToCart = function(product, quantity){
    cart.push({product, quantity});
    console.log(`${quantity} ${product} added to cart. Shipping cost is ${shippingCost}`);
  };

  const orderStock = function(product, quantity){
    console.log(`${quantity} ${product} ordered from supplier`);
  };
  // Need to return something, in order to return a public API. For that, an object is returned containing stuff which needs to be made public.
  return {
    addToCart,
    cart, 
    totalPrice,
    totalQuantity
  };
})();
// Everything inside the above module is private to the module.
// The above fn returns the object mentioned inside return statement and assign it to the ShoppingCart2 variable mentioned at the start of fn. This IIFE is returned then long ago.
// All this is possible because of closures. Hence, addToCart can acccess the cart variable.

ShoppingCart2.addToCart('apple', 4);
ShoppingCart2.addToCart('pizza', 5);
ShoppingCart2;
ShoppingCart2.shippingCost; // inaccessible.

لقد كان نمط الوحدة يعمل حتى قبل وحدات ES6.

العيب:

  1. الآن إذا أردنا وحدة واحدة لكل ملف، كما هو الحال مع وحدات ES6، فيجب إنشاء نصوص برمجية متعددة وربطها داخل ملف HTML.
  2. سيكون ترتيب تحميل البرنامج النصي مهمًا أيضًا.
  3. جميع هذه المتغيرات ستعيش في نطاق عالمي.

بجانب وحدات ES6 الأصلية ونمط الوحدات، دعمت JS أيضًا أنظمة الوحدات الأخرى التي لم تكن أصلية في JS. السابق. أيه إم دي، كومون جي إس
السابق. تُستخدم وحدات CommonJS في Node.js طوال فترة وجودها. تم مؤخرًا تنفيذ وحدات ES6 في Node.js
لا تزال جميع الوحدات الموجودة في مستودع npm تستخدم نظام الوحدة commonJS حيث أن npm كان مخصصًا في الأصل للعقدة. في وقت لاحق فقط، أصبح npm مستودعًا لعالم JS بأكمله. وبالتالي، نحن عالقون بشكل أساسي مع CommonJS. لذلك، لا يزال هناك حاجة إلى الاهتمام بـ CommonJS باعتباره تأثيره في Node.js
تمامًا مثل وحدة ES6، الملف الواحد هو وحدة واحدة في CommonJS.
لن يعمل كود commonJS في المتصفح، ولكنه سيعمل في العقدة.js
سوف تحل وحدات ES محل جميع أنظمة الوحدات في نهاية المطاف ولكن اعتبارًا من الآن نحتاج إلى استخدام commonjs أيضًا.

الكلمة الأساسية للتصدير هي كائن، لم يتم تعريفه في الكود الخاص بنا وكذلك في المتصفح.

// EXPORT
export.addToCart = function(product, quantity){
    cart.push({product, quantity});
    console.log(`${quantity} ${product} added to cart. Shipping cost is ${shippingCost}`);
};

// IMPORT: is similar to ES Modules but would use a require fn.
// require is not defined in browser env but its defined in node env as its a part of commonjs
const addToCart = require('./shoppingCart.js')
بيان الافراج تم نشر هذه المقالة على: https://dev.to/mahf001/iife-module-pattern-commonjs-5gkd?1 إذا كان هناك أي انتهاك، يرجى الاتصال بـ [email protected] لحذفه
أحدث البرنامج التعليمي أكثر>

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

Copyright© 2022 湘ICP备2022001581号-3