حاليًا أنا أعمل/أحافظ على تطبيقات js/react القديمة، حيث لا يوجد خيار لإعادة العمل على الكتابة النصية، ولهذا السبب أقوم بتشغيل jsDoc كنظام نوع وقت التطوير الحالي لـ JS.

تلدر؛

تم إنشاء وحدة Typescript npm بواسطة jsDoc، ويعيد useDuck العصر الذهبي للإعادة تحت 70LOC. حالة الاستخدام الرئيسية لهذه الوحدة في وقت التطوير، عندما تساعد حالتك المعقدة على البقاء آمنًا في الكتابة.

const [state, quack] = useDuck(reducer, virtualState,actionMap);

const [state, quack] = useDuck(reducer, initialState, actionsMap);

jsdoc-بطة

الطريق إلى الآلة الكاتبة إلى jsDoc

أصبحت تجربتي مع الآلة الكاتبة أعمق قليلاً عندما قمت بإنشاء مكتبة npm لحالة التفاعل خفيفة الوزن: مصنع حالة التفاعل

تم الإعلان عن المستخدم أنواع الحالة والأفعال -> استخدم ستات فاكتوري -> [الحالة، مجموعة الإجراءات المرسلة]

const [state, quack] = useDuck(reducer, initialState, actionsMap);

اختبار حدود jsDoc

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

نظام الرعب من النوع : المخفض

في نقطة معينة وجدت حدًا صارمًا لقدرة jsDoc، عندما أحاول كتابة دالة مُخفضة، حيث تكون النتيجة Quack ولكنها بالطبع تبدأ بـ {}. لذا فإن نهاية تشغيل المخفض فقط هي التي أدت إلى إنشاء Quack المناسب لأن هذا النوع لديه فضول بشأن الكائن الذي يحتوي على كل المفتاح المطلوب. لذلك لا أستطيع حل هذه المشكلة حتى الآن، إذا كان بإمكان أي شخص أن يعطي فكرة جيدة عن كيفية حلها، فيرجى مشاركتها معي أو الانضمام إلى هذا التطوير النموذجي كمتعاون.

فخ آخر: لا توجد أنواع في الوحدة بدون TS

في البداية، أقوم بإنشاء ملف js واحد يحتوي على جميع jsDoc @typedef الضرورية، عاجلاً أم آجلاً سيعمل هذا. وهذه هي اللحظة التي أعتقد أنها مجرد خطوة واحدة لإنشاء وحدة عقدة لهم.

لكن الحقيقة المحزنة هي أن وحدة npm التي تحتوي على أنواع مُصدَّرة لا تعمل مع jsDoc فقط، لذا من الضروري تجميع d.ts لذا في النهاية، لا تذكر وحدة jsDoc 100% JS بدلاً من ذلك، يستخدم البناء typescript أيضًا.

@typedef في وحدة jsdoc-duck

كما تعلم في منتدى dev.to، لا يتعرف تمييز بناء الجملة على jsDoc. أشياء خاطئة أخرى، يعمل @typedef في اختباري فقط إذا كتبت سطرًا واحدًا، لذا فهو يتعارض مع التعليمات البرمجية النظيفة.

سأكتب في مدونتي التالية حالة الاستخدام الملموسة لهذه المكتبة، والفرز: تبسيط ومعالجة حالة التفاعل باستخدام useReducer.

/** * @template T - نوع الحمولة * @typedef {T يمتد { النوع: يستنتج U، الحمولة؟: يستنتج P } ? { النوع: U، الحمولة؟: P } : أبدًا} نوع الإجراء */ // @ts-ignore /** @template AM - خريطة الإجراءات @typedef {{ [K in AM['type']]: K }} التسميات */ // @ts-ignore /** @template AM - خريطة الإجراءات @typedef {{ [T in AM["type"]]: Extract يمتد { payload: infer P } ? (الحمولة: P) => باطلة : () => باطلة }} الدجال */ /** *@قالب ST - الحالة * @template AM - خريطة الإجراءات * @typedef {(الحالة: ST، الإجراء: AM) => ST} المخفض */

/**
 * @template T - Payload Type
 * @typedef {T extends { type: infer U, payload?: infer P } ? { type: U, payload?: P } : never} ActionType
 */

// @ts-ignore
/** @template AM - Actions Map @typedef {{ [K in AM['type']]: K }} Labels */

// @ts-ignore
/** @template AM - Actions Map @typedef {{ [T in AM["type"]]: Extract extends { payload: infer P } ? (payload: P) => void : () => void }} Quack */

/**
 * @template ST - State
 * @template AM - Actions Map
 * @typedef {(state: ST, action: AM) => ST} Reducer
 */