مولدات جافا سكريبت: أنماط متقدمة للتكرار غير المتزامن وآلات الحالة

تُعد مولدات جافا سكريبت (JavaScript generators) ميزة قوية تتيح لك إنشاء مكررات (iterators) بطريقة أكثر إيجازًا وقراءة. ورغم أنها تُقدَّم غالبًا بأمثلة بسيطة لتوليد التسلسلات، فإن إمكاناتها الحقيقية تكمن في الأنماط المتقدمة مثل التكرار غير المتزامن وتنفيذ آلات الحالة. ستتعمق هذه المقالة في هذه الأنماط المتقدمة، مع تقديم أمثلة عملية ورؤى قابلة للتنفيذ لمساعدتك على الاستفادة من المولدات في مشاريعك.

فهم مولدات جافا سكريبت

قبل الغوص في الأنماط المتقدمة، دعنا نلخص بسرعة أساسيات مولدات جافا سكريبت.

المولد هو نوع خاص من الدوال يمكن إيقافه مؤقتًا واستئنافه. يتم تعريفها باستخدام الصيغة function* وتستخدم الكلمة المفتاحية yield لإيقاف التنفيذ مؤقتًا وإرجاع قيمة. تُستخدم الدالة next() لاستئناف التنفيذ والحصول على القيمة التالية التي تم إنتاجها.

مثال أساسي

إليك مثال بسيط لمولد ينتج سلسلة من الأرقام:

            
function* numberGenerator() {
  yield 1;
  yield 2;
  yield 3;
}

const generator = numberGenerator();

console.log(generator.next()); // { value: 1, done: false }
console.log(generator.next()); // { value: 2, done: false }
console.log(generator.next()); // { value: 3, done: false }
console.log(generator.next()); // { value: undefined, done: true }

            

              
                Copy
              
            
          

التكرار غير المتزامن مع المولدات

أحد أكثر حالات الاستخدام إقناعًا للمولدات هو التكرار غير المتزامن. يتيح لك هذا معالجة تدفقات البيانات غير المتزامنة بطريقة أكثر تسلسلًا وقراءة، متجنبًا تعقيدات دوال رد النداء (callbacks) أو الوعود (Promises).

التكرار غير المتزامن التقليدي (الوعود - Promises)

لنفترض سيناريو تحتاج فيه إلى جلب بيانات من عدة نقاط نهاية لواجهة برمجة تطبيقات (API) ومعالجة النتائج. بدون المولدات، قد تستخدم الوعود (Promises) و async/await بهذا الشكل:

            
async function fetchData() {
  const urls = [
    'https://api.example.com/data1',
    'https://api.example.com/data2',
    'https://api.example.com/data3'
  ];

  for (const url of urls) {
    try {
      const response = await fetch(url);
      const data = await response.json();
      console.log(data); // Process the data
    } catch (error) {
      console.error('Error fetching data:', error);
    }
  }
}

fetchData();

            

              
                Copy
              
            
          

على الرغم من أن هذا النهج عملي، إلا أنه يمكن أن يصبح مطولًا وأصعب في الإدارة عند التعامل مع عمليات غير متزامنة أكثر تعقيدًا.

التكرار غير المتزامن مع المولدات والمكررات غير المتزامنة

توفر المولدات مع المكررات غير المتزامنة (async iterators) حلاً أكثر أناقة. المكرر غير المتزامن هو كائن يوفر دالة next() تعيد وعدًا (Promise)، والذي يتم حله إلى كائن يحتوي على خاصيتي value و done. يمكن للمولدات إنشاء مكررات غير متزامنة بسهولة.

            
async function* asyncDataFetcher(urls) {
  for (const url of urls) {
    try {
      const response = await fetch(url);
      const data = await response.json();
      yield data;
    } catch (error) {
      console.error('Error fetching data:', error);
      yield null; // Or handle the error as needed
    }
  }
}

async function processAsyncData() {
  const urls = [
    'https://api.example.com/data1',
    'https://api.example.com/data2',
    'https://api.example.com/data3'
  ];

  const dataStream = asyncDataFetcher(urls);

  for await (const data of dataStream) {
    if (data) {
      console.log(data); // Process the data
    } else {
      console.log('Error during fetching');
    }
  }
}

processAsyncData();

            

              
                Copy
              
            
          

في هذا المثال، asyncDataFetcher هو مولد غير متزامن ينتج البيانات التي يتم جلبها من كل عنوان URL. تستخدم الدالة processAsyncData حلقة for await...of للتكرار عبر تدفق البيانات، ومعالجة كل عنصر عند توفره. يؤدي هذا النهج إلى كود أكثر نظافة وقراءة يتعامل مع العمليات غير المتزامنة بشكل تسلسلي.

فوائد التكرار غير المتزامن مع المولدات

• تحسين القراءة: يُقرأ الكود بشكل يشبه حلقة متزامنة، مما يسهل فهم تدفق التنفيذ.
• معالجة الأخطاء: يمكن مركزة معالجة الأخطاء داخل دالة المولد.
• قابلية التركيب: يمكن تركيب المولدات غير المتزامنة وإعادة استخدامها بسهولة.
• إدارة الضغط العكسي (Backpressure): يمكن استخدام المولدات لتنفيذ الضغط العكسي، مما يمنع المستهلك من الإرهاق بسبب المنتج.

أمثلة من الواقع

• بث البيانات: معالجة الملفات الكبيرة أو تدفقات البيانات في الوقت الفعلي من واجهات برمجة التطبيقات. تخيل معالجة ملف CSV كبير من مؤسسة مالية، وتحليل أسعار الأسهم عند تحديثها.
• استعلامات قاعدة البيانات: جلب مجموعات بيانات كبيرة من قاعدة بيانات على دفعات. على سبيل المثال، استرداد سجلات العملاء من قاعدة بيانات تحتوي على ملايين الإدخالات، ومعالجتها على دفعات لتجنب مشاكل الذاكرة.
• تطبيقات الدردشة في الوقت الفعلي: التعامل مع الرسائل الواردة من اتصال websocket. فكر في تطبيق دردشة عالمي، حيث يتم استلام الرسائل وعرضها باستمرار للمستخدمين في مناطق زمنية مختلفة.

آلات الحالة مع المولدات

تطبيق قوي آخر للمولدات هو تنفيذ آلات الحالة. آلة الحالة هي نموذج حسابي ينتقل بين حالات مختلفة بناءً على المدخلات. يمكن استخدام المولدات لتعريف انتقالات الحالة بطريقة واضحة وموجزة.

التنفيذ التقليدي لآلة الحالة

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

            
const STATE_IDLE = 'IDLE';
const STATE_LOADING = 'LOADING';
const STATE_SUCCESS = 'SUCCESS';
const STATE_ERROR = 'ERROR';

let currentState = STATE_IDLE;
let data = null;
let error = null;

async function fetchDataStateMachine(url) {
  switch (currentState) {
    case STATE_IDLE:
      currentState = STATE_LOADING;
      try {
        const response = await fetch(url);
        data = await response.json();
        currentState = STATE_SUCCESS;
      } catch (e) {
        error = e;
        currentState = STATE_ERROR;
      }
      break;
    case STATE_LOADING:
      // Ignore input while loading
      break;
    case STATE_SUCCESS:
      // Do something with the data
      console.log('Data:', data);
      currentState = STATE_IDLE; // Reset
      break;
    case STATE_ERROR:
      // Handle the error
      console.error('Error:', error);
      currentState = STATE_IDLE; // Reset
      break;
    default:
      console.error('Invalid state');
  }
}

fetchDataStateMachine('https://api.example.com/data');

            

              
                Copy
              
            
          

يوضح هذا المثال آلة حالة بسيطة لجلب البيانات باستخدام جملة switch. مع زيادة تعقيد آلة الحالة، يصبح هذا النهج صعب الإدارة بشكل متزايد.

آلات الحالة مع المولدات

توفر المولدات طريقة أكثر أناقة وتنظيمًا لتنفيذ آلات الحالة. تمثل كل عبارة yield انتقالًا للحالة، وتغلف دالة المولد منطق الحالة.

            
function* dataFetchingStateMachine(url) {
  let data = null;
  let error = null;

  try {
    // STATE: LOADING
    const response = yield fetch(url);
    data = yield response.json();

    // STATE: SUCCESS
    yield data;
  } catch (e) {
    // STATE: ERROR
    error = e;
    yield error;
  }

  // STATE: IDLE (implicitly reached after SUCCESS or ERROR)
  return;
}

async function runStateMachine() {
  const stateMachine = dataFetchingStateMachine('https://api.example.com/data');

  let result = stateMachine.next();

  while (!result.done) {
    const value = result.value;

    if (value instanceof Promise) {
      // Handle asynchronous operations
      try {
        const resolvedValue = await value;
        result = stateMachine.next(resolvedValue); // Pass the resolved value back to the generator
      } catch (e) {
        result = stateMachine.throw(e); // Throw the error back to the generator
      }
    } else if (value instanceof Error) {
      // Handle errors
      console.error('Error:', value);
      result = stateMachine.next();
    } else {
      // Handle successful data
      console.log('Data:', value);
      result = stateMachine.next();
    }
  }
}

runStateMachine();

            

              
                Copy
              
            
          

في هذا المثال، يحدد مولد dataFetchingStateMachine الحالات: LOADING (ممثلة بـ yield fetch(url))، و SUCCESS (ممثلة بـ yield data)، و ERROR (ممثلة بـ yield error). تقوم دالة runStateMachine بتشغيل آلة الحالة، والتعامل مع العمليات غير المتزامنة وظروف الخطأ. هذا النهج يجعل انتقالات الحالة صريحة وأسهل في المتابعة.

فوائد آلات الحالة مع المولدات

• تحسين القراءة: يمثل الكود بوضوح انتقالات الحالة والمنطق المرتبط بكل حالة.
• التغليف (Encapsulation): يتم تغليف منطق آلة الحالة داخل دالة المولد.
• قابلية الاختبار: يمكن اختبار آلة الحالة بسهولة عن طريق التنقل عبر المولد وتأكيد انتقالات الحالة المتوقعة.
• قابلية الصيانة: تكون التغييرات في آلة الحالة مقتصرة على دالة المولد، مما يسهل صيانتها وتوسيعها.

أمثلة من الواقع

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

معالجة الأخطاء في المولدات

تُعد معالجة الأخطاء أمرًا بالغ الأهمية عند العمل مع المولدات، خاصة في السيناريوهات غير المتزامنة. هناك طريقتان أساسيتان للتعامل مع الأخطاء:

1. كتل Try...Catch: استخدم كتل try...catch داخل دالة المولد للتعامل مع الأخطاء التي تحدث أثناء التنفيذ.
2. دالة throw(): استخدم دالة throw() الخاصة بكائن المولد لإدخال خطأ في المولد عند النقطة التي توقف عندها مؤقتًا.

توضح الأمثلة السابقة بالفعل معالجة الأخطاء باستخدام try...catch. دعنا نستكشف دالة throw().

            
function* errorGenerator() {
  try {
    yield 1;
    yield 2;
    yield 3;
  } catch (error) {
    console.error('Error caught:', error);
  }
}

const generator = errorGenerator();

console.log(generator.next()); // { value: 1, done: false }
console.log(generator.next()); // { value: 2, done: false }
console.log(generator.throw(new Error('Something went wrong'))); // Error caught: Error: Something went wrong
console.log(generator.next()); // { value: undefined, done: true }

            

              
                Copy
              
            
          

في هذا المثال، تقوم دالة throw() بإدخال خطأ في المولد، والذي يتم التقاطه بواسطة كتلة catch. يتيح لك هذا التعامل مع الأخطاء التي تحدث خارج دالة المولد.

أفضل الممارسات لاستخدام المولدات

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

الخاتمة

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

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