JSON→Flow変換

JSONのサンプルからFlowの型宣言を作る

このページでは、JSONテキストを読み取り、サンプルに含まれるデータ構造をFlowの型コードとして出力します。FlowはJavaScript向けの静的型チェッカーで、オブジェクト型はオブジェクトが持つプロパティと値の型を記述します。入力欄にJSONを貼り付けると、文字列・数値・真偽値、配列、入れ子のオブジェクトなどをもとに宣言の草案が表示されます。

たとえば {"profile":{"name":"Aoi"},"active":true} なら、profile の内側に文字列の name があり、active は真偽値であることを型に表します。Flowでは数値は number、文字列は string、真偽値は boolean として扱われます。オブジェクトの型はプロパティの形を表すもので、値そのものをFlowコードへ変換したり、アプリの処理を実装したりするものではありません。

出力の型名はフォームで入力でき、初期値は Root です。Flowの対象ページでは型定義のみを出力する設定が有効になっています。結果はコピーまたはファイルとしてダウンロードできます。

フィールドの型は入力サンプルから推定される

型生成の出発点は、貼り付けたJSONに現れている値です。たとえば文字列のIDは、値が数字だけに見えてもJSON上で引用符に囲まれていれば文字列です。数値として書かれた整数と小数は、Flowではどちらも number です。配列は要素の例から配列型が作られ、オブジェクト内のオブジェクトは入れ子のデータ形状として表現されます。

ここでいう推定は、手元の例から形を起こす作業です。1件のJSONだけでは、別の応答で値が変わるか、フィールドが省略されるか、配列に異なる種類の値が混ざるかまでは確定できません。APIの完全な仕様やJSON Schemaを生成する機能としてではなく、型宣言のたたき台として使います。

入力を整えて型コードを取り出す

1. 有効なJSONを用意する

   JSONのオブジェクト例を入力欄に貼り付けます。コメント、末尾の余分なカンマ、ログ文字列などJSON構文に含まれないものは取り除きます。「フォーマット」でインデントを整えたり、「サンプル」で例を読み込んだりできます。

2. 型名を決める

   出力の根になる型名を入力します。既定名は Root です。実際のコードで使う名前に合わせると、コピー後の置き換えを減らせます。

3. 出力を読み、必要ならコピーする

   JSONを編集するとFlowの出力が更新されます。構文エラーがある場合はエラー表示を確認して入力を直します。生成結果をコピーするか、型名に応じた拡張子のファイルとしてダウンロードしてください。

例として、{"user":{"name":"Aoi"},"enabled":true} を入力すると、ルートのオブジェクト、user 内の文字列フィールド、真偽値フィールドの関係が型宣言に現れます。入力を別の応答例に差し替えて、構造の違いを比べることもできます。

サンプルだけでは決まらない型の境界

生成後にプロジェクトの前提と照合する

型コードは入力したJSONサンプルに基づく草案です。型宣言だけで実行時データを検査するわけではなく、APIの全ケース、必須性、列挙値、エラー応答も保証しません。数値に見える文字列、null、任意フィールド、空または混在する配列、特殊なプロパティ名を重点的に確認してください。必要に応じて複数の実例や正式なAPI仕様を使い、生成後は対象プロジェクトでFlowのバージョンと設定に合わせて型チェックを実行してください。