ממיר JSON ל-TypeScript

הדביקו תגובת API וקבלו interfaces או type aliases של TypeScript מוכנים לשימוש, כולל טיפוסים מקוננים, שדות אופציונליים ואיחודים עם null שמוסקים בשבילכם.

רץ בדפדפן שלכםבלי הרשמהשום דבר לא מועלה

TypeScript

איך משתמשים בכלי JSON ל-TypeScript

  1. הדביקו דוגמת JSON, כמו תגובת API, בתיבת הקלט, או פתחו קובץ .json.
  2. הגדירו את שם טיפוס השורש (למשל User או ApiResponse).
  3. בחרו הצהרות interface או type והפעילו או כבו export, ‏readonly או שדות שכולם אופציונליים.
  4. בחרו unknown (בטוח יותר) או any עבור ערכים שהדוגמה לא יכולה לחשוף, כמו מערכים ריקים ו-null.
  5. העתיקו את הקוד שנוצר או הורידו אותו כקובץ .ts.

איך הטיפוסים מוסקים

  • טיפוסים פרימיטיביים: מחרוזות, מספרים וערכים בוליאניים ממופים ל-string, number ו-boolean.
  • אובייקטים מקוננים הופכים ל-interfaces נפרדים עם שם ב-PascalCase, כך ש-billing_address הופך ל-BillingAddress.
  • מערכים של אובייקטים ממוזגים לטיפוס פריט אחד, בשם ביחיד: users נותן User[]. מפתח שחסר בחלק מהפריטים הופך לאופציונלי (key?:).
  • ערכי null משתלבים עם שאר הערכים שנראו עבור אותו מפתח: string | null. מפתח שתמיד null מקבל את ברירת המחדל unknown או any.
  • מערכים מעורבים הופכים למערכי איחוד כמו (number | string)[].
  • מבנים זהים מוצהרים פעם אחת ומשמשים שוב, ומבנים שונים שהיו מקבלים אותו שם מקבלים סיומת מספרית.
  • מפתחות שאינם מזהים תקינים, כמו "first-name" או "2fa", מוקפים במירכאות.

interface לעומת type

עבור מבני אובייקטים פשוטים השניים כמעט ניתנים להחלפה. הצהרות interface אפשר להרחיב ולמזג, והן נותנות שגיאות קומפיילר קצת ברורות יותר. ‏type aliases יכולים לבטא גם איחודים ו-mapped types. צוותים רבים משתמשים ב-interfaces למודלים של API וב-types לכל השאר; בחרו את מה שבסיס הקוד או ה-linter שלכם (@typescript-eslint/consistent-type-definitions) מצפים לו.

קבלו טיפוסים טובים יותר מהדוגמה

הטיפוסים יכולים להיות שלמים רק כמו הדוגמה. הדביקו תגובה שכוללת שדות אופציונליים, או מערך עם כמה פריטים מגוונים, כדי שהמחולל יוכל לזהות מפתחות אופציונליים ו-nullable. ערכים כמו תאריכים ו-enums מגיעים ב-JSON כמחרוזות רגילות; צמצמו אותם ידנית אחר כך, למשל status: 'active' | 'disabled'. לאימות בזמן ריצה, שלבו את הטיפוסים שנוצרו עם ספריית סכמות כמו Zod.

שאלות נפוצות

האם ה-JSON שלי מועלה?
לא. הטיפוסים נוצרים על ידי JavaScript בדפדפן שלכם. תגובות API שמכילות טוקנים או מידע אישי לעולם לא יוצאות מהמכשיר.
איך מזוהים מאפיינים אופציונליים?
כשלאובייקטים באותו מערך יש מפתחות שונים, מפתחות שחסרים לפחות באובייקט אחד מסומנים כאופציונליים עם ?. כשיש אובייקט יחיד כל מפתח הוא חובה, אלא אם מסמנים הכול אופציונלי.
האם להשתמש ב-<code>unknown</code> או ב-<code>any</code>?
unknown בטוח יותר: TypeScript מחייב אתכם לצמצם את הערך לפני השימוש בו. ‏any מבטל את בדיקת הטיפוסים עבור אותו ערך. השתמשו בו רק אם אתם מתכננים לחדד את הטיפוסים בהמשך.
למה תאריך ISO מקבל טיפוס <code>string</code>?
ל-JSON אין טיפוס תאריך, ולכן תאריכים מועברים כמחרוזות. אם אתם ממירים אותם עם new Date() אחרי הניתוח, שנו את המאפיין ל-Date במודל שלכם.
האם הכלי מתמודד עם JSON גדול או מקונן לעומק?
כן. זמן היצירה לינארי בגודל הקלט והיא רצה מקומית, כך שתגובות של כמה מגה-בייט מומרות בהרבה פחות משנייה.

כלים קשורים

מעצב JSON עיצוב, כיווץ ובדיקת JSON עם שגיאות לפי שורה ועמודה. השוואת JSON השוואת שני אובייקטי JSON ורשימת השינויים לפי נתיב. YAML ל-JSON המרת תצורות YAML ל-JSON, עם תמיכה בריבוי מסמכים ושגיאות מדויקות. ממיר cURL הפיכת פקודות curl לקוד fetch,‏ Axios,‏ Python,‏ Go או PHP.