محوّل JSON إلى TypeScript
الصق استجابة API واحصل على واجهات TypeScript أو أسماء أنواع مستعارة جاهزة للاستخدام، مع استنتاج الأنواع المتداخلة والحقول الاختيارية واتحادات null تلقائيًا.
يعمل في متصفحكبدون تسجيللا يُرفع شيء
طريقة استخدام JSON إلى TypeScript
- الصق عينة JSON، مثل استجابة API، في المربع الأيمن أو افتح ملف
.json. - اضبط اسم نوع الجذر (مثل
UserأوApiResponse). - اختر تصريحات
interfaceأوtypeوفعّلexportأوreadonlyأو جعل كل الحقول اختيارية. - اختر
unknown(أكثر أمانًا) أوanyللقيم التي لا تكشفها العينة، مثل المصفوفات الفارغة وقيم null. - انسخ الكود المُنشأ أو نزّله كملف
.ts.
كيف تُستنتج الأنواع
- الأنواع الأولية: تُربط السلاسل النصية والأعداد والقيم المنطقية بـ
stringوnumberوboolean. - الكائنات المتداخلة تصبح واجهات مسمّاة خاصة بها بصيغة PascalCase، فيصبح
billing_addressبالشكلBillingAddress. - مصفوفات الكائنات تُدمج في نوع عنصر واحد يُسمّى بصيغة المفرد:
usersتعطيUser[]. والمفتاح المفقود من بعض العناصر يصبح اختياريًا (key?:). - قيم null تُدمج مع القيم الأخرى المرصودة لذلك المفتاح:
string | null. والمفتاح الذي يكون دائمًاnullفقط يعود إلىunknownأوany. - المصفوفات المختلطة تصبح مصفوفات اتحاد مثل
(number | string)[]. - الأشكال المتطابقة يُصرَّح عنها مرة واحدة ويُعاد استخدامها، والأشكال المختلفة التي قد تتشارك اسمًا تحصل على لاحقة رقمية.
- المفاتيح التي ليست معرّفات صالحة، مثل
"first-name"أو"2fa"، توضع بين علامتي اقتباس.
interface مقابل type
بالنسبة لأشكال الكائنات البسيطة، يكاد الاثنان يكونان قابلين للتبادل. يمكن توسيع تصريحات interface ودمجها، وتعطي أخطاء مترجم أوضح قليلًا. أما أسماء type المستعارة فيمكنها أيضًا التعبير عن الاتحادات والأنواع المعيَّنة (mapped types). تستخدم فرق كثيرة الواجهات لنماذج API والأنواع لكل ما عدا ذلك؛ اختر ما يتوقعه مشروعك أو أداة الفحص لديك (@typescript-eslint/consistent-type-definitions).
احصل على أنواع أفضل من عينتك
لا يمكن أن تكون الأنواع أكمل من العينة. الصق استجابة تتضمن الحقول الاختيارية، أو مصفوفة بعدة عناصر متنوعة، ليتمكن المولّد من اكتشاف المفاتيح الاختيارية والقابلة لـ null. تصل قيم مثل التواريخ والتعدادات كسلاسل نصية عادية في JSON؛ ضيّقها يدويًا بعد ذلك، مثل status: 'active' | 'disabled'. وللتحقق أثناء التشغيل، اجمع الأنواع المُنشأة مع مكتبة مخططات مثل Zod.
الأسئلة الشائعة
هل يُرفع JSON الخاص بي؟
كيف تُكتشف الخصائص الاختيارية؟
?. ومع كائن واحد يكون كل مفتاح مطلوبًا، ما لم تفعّل الكل اختياري.هل أستخدم <code>unknown</code> أم <code>any</code>؟
unknown أكثر أمانًا: إذ تُلزمك TypeScript بتضييق القيمة قبل استخدامها. أما any فيوقف فحص الأنواع لتلك القيمة. استخدمه فقط إذا كنت تخطط لتحسين الأنواع لاحقًا.لماذا يُعطى تاريخ ISO النوع <code>string</code>؟
new Date() بعد التحليل، فغيّر الخاصية إلى Date في نموذجك.