JSON to TypeScript 변환

JSON 데이터를 자동으로 TypeScript 인터페이스 또는 타입 정의로 변환합니다

JSON 입력
줄 수: 1 | 문자 수: 0
TypeScript 출력
// JSON을 입력하면 자동으로 TypeScript 타입 정의가 생성됩니다
타입 수: 0 | 줄 수: 1

JSON to TypeScript란?

JSON to TypeScript는 JSON 데이터를 자동으로 TypeScript 타입 정의로 변환하는 도구입니다. JSON 구조를 분석하여 해당하는 interface 또는 type 선언을 생성하고, TypeScript 프로젝트에서 타입 안전성과 코드 힌트를 얻는 데 도움을 줍니다.

사용 방법

  1. 왼쪽 입력란에 JSON 데이터를 붙여넣기하거나 예시 버튼을 클릭하여 예시를 로드합니다
  2. 옵션을 구성합니다: 루트 타입 이름 설정, interface/type 스타일 선택, export 추가 여부等
  3. 오른쪽에 해당하는 TypeScript 타입 정의가 자동으로 생성됩니다
  4. '복사' 버튼을 클릭하여 생성된 타입 정의를 클립보드에 복사합니다
  5. TypeScript 프로젝트에 타입 정의를 붙여넣기하여 사용합니다

사용 예시

간단한 객체 변환

输入 JSON:
{
  "name": "张三",
  "age": 28,
  "isActive": true
}

输出 TypeScript:
export interface Root {
  name: string;
  age: number;
  isActive: boolean;
}

중첩된 객체 변환

输入 JSON:
{
  "user": {
    "id": 1,
    "profile": {
      "avatar": "url",
      "bio": "简介"
    }
  }
}

输出 TypeScript:
export interface UserProfile {
  avatar: string;
  bio: string;
}

export interface User {
  id: number;
  profile: UserProfile;
}

export interface Root {
  user: User;
}

자주 묻는 질문 (FAQ)

Q: 생성된 타입은 어떻게 사용하나요?

A: 생성된 타입 정의를 .ts 파일에 복사한 후 코드에서 사용합니다. 예: const data: Root = JSON.parse(response)

Q: interface와 type의 차이는?

A: interface는 확장 및 구현이 가능하여 객체 타입 정의에 적합하고, type은更加 유연하여联合 타입, 交叉 타입等을 정의할 수 있습니다. 간단한 객체 구조에서는两者의 기능이 유사합니다.

Q: 배열 타입의 JSON은 어떻게处理하나요?

A: 도구가 자동으로 배열 요소의 타입을识别합니다. 객체 배열인 경우 배열 요소에 대한单独한 타입 정의를 생성한 후 ItemType[]形式으로 배열을表示합니다.

Q: 생성된 타입을 편집할 수 있나요?

A: 생성 후自由롭게 편집할 수 있습니다.实际需求에 따라 타입 이름을调整하고, 선택 사항 필드 표시(?)를 추가하거나,部分 필드의 타입 정의를修改하는 것을建议합니다.