แปลง JSON เป็น TypeScript

เครื่องมือนี้ทำอะไร

ตัวสร้าง JSON เป็น TypeScript อ่านตัวอย่าง JSON เช่น ข้อมูลตอบกลับจาก API หรือไฟล์ตั้งค่า แล้วเขียน interface ของ TypeScript ที่อธิบายข้อมูลนั้น แทนที่จะพิมพ์ทุกฟิลด์เอง เพียงวางข้อมูลตอบกลับจริงหนึ่งชุดก็ได้ชนิดที่นำไปใช้ในโค้ดได้ทันที สำหรับผลลัพธ์ของ fetch สถานะของ Redux หรือข้อมูลทดสอบ

ตัวสร้างจะตรวจดูทุกค่า ไม่ใช่แค่ค่าแรก ตัวเลขกลายเป็น number ข้อความกลายเป็น string ออบเจ็กต์ที่ซ้อนกันได้ interface ของตัวเอง และสมาชิกของอาร์เรย์จะถูกรวมกัน ฟิลด์ที่มีเฉพาะบางสมาชิกจึงถูกทำเครื่องหมายว่าไม่บังคับ และฟิลด์ที่บางครั้งเป็น null จะได้ชนิดที่รับ null ได้

วิธีใช้

1. วาง JSON ลงในช่องป้อนข้อมูล อัปโหลดไฟล์ .json หรือคลิก ตัวอย่าง
2. ตั้งชื่อชนิดรากและเลือกสไตล์ ได้แก่ interface หรือ type เขียน null เป็น | null หรือเป็นฟิลด์ไม่บังคับ พร็อพเพอร์ตี readonly และจะใส่ export ให้ทุกการประกาศหรือไม่
3. คัดลอก TypeScript หรือดาวน์โหลดเป็นไฟล์ .ts

JSON ที่ไม่ถูกต้องจะแจ้งบรรทัดและคอลัมน์ที่มีปัญหา เพื่อให้แก้ตัวอย่างได้ทันที

ตัวอย่าง

JSON นี้:

{ "id": 7, "name": "Ada", "tags": ["admin"], "manager": { "id": 1, "email": null } }

จะกลายเป็นการประกาศเหล่านี้:

export interface Root {
  id: number;
  name: string;
  tags: string[];
  manager: Manager;
}

export interface Manager {
  id: number;
  email: null;
}

เคล็ดลับ

• ตัวอย่างเดียวแสดงได้เฉพาะสิ่งที่มีอยู่ในนั้น หากฟิลด์อาจเป็นสตริงหรือ null ให้ใส่ตัวอย่างทั้งสองแบบ หรือนำหลายตัวอย่างใส่ในอาร์เรย์เพื่อให้รวมกัน
• ชื่อฟิลด์ที่ไม่ใช่ตัวระบุที่ถูกต้อง เช่น first-name จะเขียนในเครื่องหมายคำพูด ผลลัพธ์จึงคอมไพล์ได้เสมอ
• ผลลัพธ์เป็นเพียงจุดเริ่มต้น หากคุณรู้มากกว่าตัวอย่าง ให้จำกัดฟิลด์สตริงเป็นยูเนียนของค่าคงที่หรือ Date
• ต้องการ Go? ตัวแปลง JSON เป็น Go ใช้การอนุมานแบบเดียวกันเพื่อเขียน struct พร้อมแท็ก json