JSONとは？その仕様と使いどころ

JSONとは、テキストベースのデータフォーマット（データの書き方）である。仕様がシンプルかつ直感的で、人でもプログラムでも読みやすいのが利点だ。

"JavaScript Object Notation"の略で、元々はJavaScriptで使うために開発された。その扱いやすさから、現在ではJSに限らず幅広い言語で使われている。

JSONの仕様

JSONでは、以下の6つの記号によってデータを構造化する。

記号の種類	概要
`{`	オブジェクトの開始を示す。
`}`	オブジェクトの終了を示す。
`[`	配列の開始を示す。
`]`	配列の終了を示す。
`:`	キーと値の境目を示す。
`,`	値同士の境目を示す。

基本的な形は、以下のいずれかになる。

{"文字列":下で説明する6つの値のいずれか}
// or
[下で,説明する,6つの,値の,いずれか]

上がオブジェクト、下が配列である。含められる値は、以下の7種類のいずれかとなる。

オブジェクト

オブジェクトは、波括弧で囲まれた0個以上のキーバリューペアの集まりである。キーバリューペアは、文字列と値を:で区切った形のやつだ。

キーは原則文字列でなければならず、また一意にすべきとされる。重複するキーを指定した場合の挙動は、JSONデータを読み込むソフトウェアによる。大抵は最後に読み込んだ値が採用されるが、パースエラーを返すものもある。

配列

配列は、角括弧で囲まれ、カンマで区切られた0個以上の値の集まりである。値の型はいずれでも構わないし、混在しても良い。

数字

ダブルクォーテション（""）で囲まれていない、裸の数字。10進数で、マイナス記号は使えるがプラス記号は使えない。

また、1つ以上の桁に続けて、小数表記、指数表記も使える。

指数表記に使うeは、大文字でもいいし小文字でもいい。また、マイナス記号だけでなくプラス記号も使える（プラス記号は省略できる）。

小数表記や単体で使う場合を除き、0から始まる数値は許されていない。

{
"正の整数":123,
"負の整数":-123,
"正の小数":12.3,
"負の小数":-12.3,
"正の指数":12e+3,
"負の指数":12e-3
}

文字列

ダブルクォーテーション（""）で囲まれた文字列。エスケープが必要な文字を除き、すべてのユニコード文字を含めることができる。

エスケープが必要な文字とは、例えば"とか\とかである。これらはバックスラッシュを付けて\"や\\とすれば文字として扱われる。

なお、JavaScriptではダブルクォーテーションもシングルクォーテーションも使えるが、JSONではシングルクォーテーションは無効である。

true/false/null

上記4種類に加え、裸のtrue、裸のfalse、裸のnullも使える。

エンコーディング

JSONファイルは、UTF-8でエンコードされていなければならない。

使いどころ

JSONの使いどころは多岐にわたる。簡単な設定ファイルにも使われるし、GeoJSONなど巨大で複雑なデータをポータブルに扱うためにも使われる。

また、NoSQL形式のデータベースの多くはJSON形式でデータを格納する。

キーバリューが前提であるので、カンマ区切りのCSVよりも直感的で、タグづけするXMLよりも読みやすい。

手軽にデータを扱うどのシチュエーションにもマッチする。

超簡易JSONバリデータ

<p id="result">超簡易JSONバリデータ</p>
<textarea style="width:100%;height:300px;" id="jsonOrNot" maxLength="500" placeholder="{&amp;quot;key1&amp;quot;:&amp;quot;value1&amp;quot;}"></textarea>
<script>
  document.getElementById("jsonOrNot").addEventListener("input", (e) => {
    const maybeJson = e.srcElement.value;
    const resultViewer = document.getElementById("result");
    try {
      JSON.parse(maybeJson);
      resultViewer.style.color = "limegreen";
      resultViewer.innerHTML = "グッドJSON";
    } catch (e) {
      resultViewer.style.color = "crimson";
      resultViewer.innerHTML = "ノーグッドJSON: " + e.message;
    }
  });
</script>