Cookie の使用について.本サイトでは、基本機能の提供に必要な必須 Cookie を使用しています。さらに、同意いただいた場合に限り、アクセス解析 Cookie を利用して利用状況を把握し、サービス改善に役立てます。詳しくは .
Cookie の使用について.本サイトでは、基本機能の提供に必要な必須 Cookie を使用しています。さらに、同意いただいた場合に限り、アクセス解析 Cookie を利用して利用状況を把握し、サービス改善に役立てます。詳しくは .
このツールは使いやすかったですか？
フィードバックは改善に役立ちます
将JSON数据转换为ES6 JavaScript类代码，自动生成嵌套类和构造函数，提升前端开发效率。
概要
解決できる課題、処理の仕組み、データの範囲を確認できます。
このページでは、入力したJSONの形を読み取り、対応するJavaScriptコードを生成します。JSONはAPI応答や設定データなどを表すテキスト形式で、JavaScriptのクラスは同じ形のオブジェクトを作るためのテンプレートです。変換結果をモデルのたたき台として使えば、キーや入れ子構造を手で書き起こす作業を減らせます。
入力できるのは標準的なJSONです。オブジェクトだけでなく配列を含む例も扱えます。JavaScriptのオブジェクト表記とは異なり、JSONではキーと文字列値を二重引用符で囲み、コメントや末尾の余分なカンマは使えません。形式の定義はIETFのRFC 8259、JavaScript側のクラスの考え方はMDNの資料で確認できます。
出力はサンプル中で観察できた値と構造をもとにしたコードです。入れ子のオブジェクトや配列も対象になりますが、1つの例だけでは省略可能な項目、別の応答で現れる型、業務上の制約までは確定できません。配列の型など判断材料が足りない箇所は、生成後に実際のAPI仕様や複数の応答例と照らし合わせてください。
JSONの値は文字列・数値・真偽値・null・オブジェクト・配列などに限られます。たとえば日付らしい値もJSON上では文字列です。生成結果が日付オブジェクトへの変換や、必須項目・値の範囲を検証する仕組みを自動で備えるとは限りません。
使い方
手順に沿って操作し、例を使って入力と結果を確認します。
キーと文字列を二重引用符で囲んだJSONを入力します。書式を整えたい場合は、入力欄のフォーマット操作を使ってから確認します。
型名欄にルートのクラス名を入力します。初期値のままでも生成できます。詳細設定を開くと、推論やJavaScript固有の実行時型チェックに関する選択肢を確認できます。
出力欄でキー名、入れ子の型、配列の要素型をサンプルと照合します。入力を直すとコードも更新されるので、複数の実例がある場合は形の違いを見比べてください。
内容を確認したらコードをコピーするか、型名に対応するJavaScriptファイルとしてダウンロードします。利用先の環境で読み込み、必要な修正を加えてください。
活用例
仕事や日常の流れの中での活用方法を紹介します。
APIレスポンスのJSON例を受け取った開発者が、キーと入れ子の対応を含むクラス草案を先に作り、仕様書と照合してモデルの土台にできます。
チームでサンプルを共有するとき、生成コードをコピーしてレビューに添えれば、フィールドの抜けや想定外の入れ子を話し合う出発点になります。正式な契約はAPI仕様で別途確認します。
Q&A
よくある疑問や迷いやすい点をまとめて確認できます。
JavaScript風の記法をJSON欄へ貼ると解析できないことがあります。キーと文字列を二重引用符で囲み、コメントや末尾カンマを除き、括弧の対応を確認してください。
空配列には要素の例がないため、型を推定する材料がありません。実際に要素を含む応答例かAPI仕様に基づき、生成後に型を補ってください。
JSONでは日付も文字列として表されます。日時に見える文字列が自動でJavaScriptのDateへ変換されるとは限らないため、必要な変換処理をコードに追加します。
生成コードはサンプルから形を作るための出発点です。必須性、値の範囲、形式、想定外データへの対応はAPI仕様をもとに別途実装・確認してください。
注意
利用範囲、結果の制限、必要な注意点を事前に確認します。
単一のサンプルは、その時点で現れた値しか示しません。省略可能なキー、nullの意味、配列内の複数の形、将来追加されるフィールドがすべて表現されるわけではありません。複数の実例や提供元の仕様と比較し、必要な型や変換を手直ししてからプロジェクトに取り込んでください。生成できたことは、コードの正しさや入力データの妥当性を保証するものではありません。
関連
関連ツール、特集、利用可能なAPIを探せます。