Chuyển đến nội dung chính
LibraTool logoLibraTool

Chuyển Đổi JSON sang TypeScript miễn phí

Tạo interface hoặc type alias TypeScript từ bất kỳ đối tượng hoặc mảng JSON nào. Dán JSON và nhận ngay các kiểu TypeScript sẵn dùng.

Hoạt động ngoại tuyến sau khi tải
export interface User {
  id: number;
  name: string;
  email: string;
  isActive: boolean;
  score: number;
  tags: string[];
  address?: null;
}

export interface Root {
  user: User;
  createdAt: string;
  version: number;
}

Công dụng phổ biến

  • Tạo Loại TypeScript từ Phản Hồi APIDán phản hồi JSON API và tạo tức thì các giao diện TypeScript để bảo vệ mã front-end của bạn bằng loại.
  • Loại TypeScript cho Cấu Hình và Đối Tượng Cài ĐặtTạo các giao diện TypeScript từ tệp cấu hình JSON để thêm type safety vào cài đặt ứng dụng của bạn.
  • Tạo Loại TypeScript từ Bản Ghi Cơ Sở Dữ LiệuChuyển đổi các bản ghi cơ sở dữ liệu được xuất dưới dạng JSON hoặc kết quả truy vấn ORM thành giao diện TypeScript cho việc nhập dữ liệu.
  • Loại Dữ Liệu Mock và Fixture Kiểm TraTạo các giao diện TypeScript từ dữ liệu mock JSON và fixture kiểm tra để gõ các bài kiểm tra đơn vị và Storybook của bạn.
  • Loại Phản Hồi API của Bên Thứ BaTạo các giao diện TypeScript từ các phản hồi API của bên thứ ba nơi các loại chính thức bị thiếu hoặc lỗi thời.

Cách hoạt động

Công cụ này dùng thuật toán suy luận kiểu đệ quy tự viết, không có thư viện bên ngoài — JSON.parse để kiểm tra và phân tích đầu vào, rồi một phép duyệt tùy chỉnh đi qua mọi giá trị trong cây JSON và xuất khai báo TypeScript interface hoặc type trực tiếp trong trình duyệt. Không có gì được gửi đến máy chủ.

  1. 1
    Phân tích và kiểm tra JSON
    Đầu vào của bạn được truyền vào JSON.parse. Nếu thất bại, lỗi phân tích chính xác được hiển thị ngay bên dưới ô nhập. Phân tích thành công tạo ra cây giá trị có kiểu làm cơ sở cho phần chuyển đổi còn lại.
  2. 2
    Suy luận kiểu đệ quy
    Hàm đệ quy getType duyệt mọi nút: kiểu nguyên thủy ánh xạ thành string, number, boolean hoặc null; đối tượng tạo ra một interface có tên mới; mảng đối tượng được gộp khóa từ mọi phần tử nên khóa chỉ có ở một số mục trở thành tùy chọn và các kiểu giá trị xung đột được nối bằng |.
  3. 3
    Đặt tên interface tránh trùng lặp
    Mỗi đối tượng lồng nhau được đặt tên PascalCase suy ra từ khóa JSON (snake_case, kebab-case và dấu cách đều được chuẩn hóa). Nếu hai đối tượng có cấu trúc khác nhau trùng tên, một hậu tố số được thêm vào (Data, Data2, …) thay vì âm thầm ghi đè định nghĩa trước đó.
  4. 4
    Hiển thị đầu ra và có thể tải về
    Các interface lồng nhau được xuất trước, rồi đến kiểu gốc, định dạng thành export interface hoặc export type tùy lựa chọn. Kết quả có thể được sao chép vào bộ nhớ tạm hoặc tải về dạng tệp .ts — tất cả được tạo bằng Blob chuẩn, không gọi máy chủ.

Công cụ liên quan

📋

Chuyển JSON Schema sang Form

Dán JSON Schema và nhận form hoạt động trực tiếp — trường văn bản, số, checkbox, dropdown và danh sách — sau đó sao chép JSON mà đầu vào của bạn tạo ra. Lý tưởng để tạo nguyên mẫu nội dung request API. Chạy trên trình duyệt.

Thử ngay
⌨️

Kiểm Tra Tốc Độ Gõ (WPM)

Đo tốc độ gõ (WPM) và độ chính xác của bạn với các bài kiểm tra thời gian, đếm từ, câu trích dẫn, tuỳ chỉnh và zen. Tốc độ WPM trực tiếp, tốc độ thô, nhất quán, biểu đồ kết quả, nhiều ngôn ngữ và phản hồi từng ký tự — tất cả trong trình duyệt của bạn.

Thử ngay
📐

Tạo CSS clamp()

Tạo giá trị CSS clamp() linh hoạt cho typography và khoảng cách responsive. Đặt kích thước min/max và phạm vi viewport, xem trước trực tiếp và sao chép CSS một dòng.

Thử ngay

Câu hỏi thường gặp