JSONとは?データフォーマット(データ形式)について学ぼう!

 2020.08.25  株式会社システムインテグレータ

JSONとは「JavaScriptのオブジェクト記法を用いたデータ交換フォーマット」です。
Python、PHP、JavaScript、C++、Javaなど様々な言語でサポートされており、JSONを間に挟むことで各プログラミング言語間のデータの受け渡しが非常に楽になります。

本記事ではJSONの概要や実際の書き方を解説します。

JSONの特徴

JSONとは「JavaScript Object Notation」の略で、意味は「JavaScriptのオブジェクトの書き方を元にしたデータ定義方法」です。

JavaScriptでオブジェクトを作成する際は {} や [] などの括弧を使って記述しますが、JSONはその記法を元にしています。元々はJavaScriptで使われる想定で作成されたデータ構造なので、JavaScriptと非常に相性が良いです。現在はJavaScript以外にもPythonやJava、PHPなどの幅広い言語で使われていて、JavaScriptなどのクライアント言語とPythonなどのサーバサイド言語間のデータのやり取りで使われることが多いです。

JSONとXMLの違い

近年データのやり取りはJSONですることが多いですが、JSONが登場する前まではXMLというデータ構造が主に使われていました。
XMLはHTMLの記法を元にしたデータ定義方法で、データ定義言語と呼ばれています。
HTMLと同じようにタグを使ってデータの構造を定義し、柔軟に記述できるので(XMLよりも前に使われていた)CSVよりも複雑な構造も扱えました。しかし、その分人間にとって直感的には理解し難いのが難点でした。

XMLの例

<?xml version="1.0" encoding="utf-8"?>
<data>
  <item>
    <id>1</id>
    <name>tanaka</name>
  </item>
  <item>
    <id>2</id>
    <name>nakata</name>
  </item>
</data>

一方、JSONはJavaScriptのオブジェクト記法で定義するので、慣れている人にとっては非常に分かりやすく感じます。

また、例えばPythonからJSONデータを送り、JavaScriptでそのままオブジェクトとして扱う、といった使い方が可能です。XMLだとXML構文を解析する必要がでてくるので、プログラムのパフォーマンスが低下するというデメリットもあります。

JSONの例

[
  {"id" : "1", "name" : "tanaka"},
  {"id" : "2", "name" : "nakata"}
]

近年JavaScriptはWeb開発に必ず必要で、この環境の変化もJSONが広く使われるようになった要因と言えるでしょう。

JSONの書き方

次にJSONの書き方を見ていきましょう。
JavaScriptでオブジェクトを扱ったことがあるならそこまで複雑ではありませんし、使ったことがなくても今後JavaScriptを操作する上で役に立つので覚えておきましょう。

基本の書き方

JSONは {} の中にキーと値をコロンで区切って記述します。キーは必ずダブルクォーテーションで囲む必要があり、シングルクォーテーションだとエラーになります。

{“key” : “value”}

カンマで区切ると、キーと値の組み合わせを複数記述できます。

{“key1” : “value1”, “key2” : “value2”}

行数が多くなってくると読みにくくなってきます。その場合は改行とインデントを使いましょう。

{
    “key1” : “value1”,
    “key2” : “value2”,
    “key3” : “value3”
}

JSONが対応している型

JSONは次のデータ型に対応しています。

  • 文字列
  • 数値
  • null
  • bool値
  • オブジェクト
  • 配列

文字列

文字列はダブルクォーテーション(“)、バックスラッシュ(\)以外の文字であればなんでも使用できます(もちろん日本語もOK)。

{“name” : “tanaka”}

数値

数値はダブルクォーテーションで囲みません。ダブルクォーテーションで囲むと文字列扱いになるので注意が必要です。

{“id”, 1}

null

nulは全て小文字で指定します。

{“id” : null}

bool値

bool値(true or false)の指定も可能です。こちらも数値と同じくダブルクォーテーションは必要ありません。

{“a” : true, “b” : false}

オブジェクト

オブジェクトの中にオブジェクトを入れることもできます。これを「ネストする」と言います。ここまでくるとデータ構造っぽさが出てきます。

{
    "id": 1,
    "name": "tanaka",
    "attribute": {
        "gender": "male",
        "phone_number": "xxxxxxxxxxx",
        "birth": "1991/01/01"
    }
}

配列

オブジェクトの場合は {} を使いましたが、配列を使いたい場合は [] を使います。
配列内の要素はカンマで区切ることで複数入力できます。

{
    "id": 1,
    "name": "tanaka",
    "result": [
        87,
        83,
        71,
        59,
        91
    ]
}

JSONの使い方

最後に実際にJavaScript内でJSONを使ってみましょう。

JSON文字列をオブジェクトに変換したり、逆にオブジェクトをJSON文字列に再変換したりしてみます。まずはJSON文字列→オブジェクトから見ていきましょう。

JSON文字列 → オブジェクトへの変換

JavaScriptコード:
var json_str = '{"id":1, "name":"tanaka", "attribute":{"gender":"male", "phone_number":"xxxxxxxxxxx", "birth":"1991/01/01"}}';
var obj = JSON.parse(json_str)
console.log(obj.name)
console.log(obj.attribute.birth)

結果:
tanaka
1991/01/01

json_strがJSON文字列です。これをJSON.parse()に渡すことでオブジェクトに変換されます。
あとは通常のオブジェクトの扱いと同じで、ドットで繋げながら取得したい要素にアクセスしています。次にオブジェクト→JSON文字列への変換を見ていきましょう。

オブジェクト → JSON文字列への変換

JavaScriptコード:
var obj = {"id":1, "name":"tanaka", "attribute":{"gender":"male", "phone_number":"xxxxxxxxxxx", "birth":"1991/01/01"}}
var json_str = JSON.stringify(obj)
console.log(json_str)
console.log(typeof json_str)

結果:
{"id":1,"name":"tanaka","attribute":{"gender":"male","phone_number":"xxxxxxxxxxx","birth":"1991/01/01"}}
string

objはJavaScriptのオブジェクトです。これをJSON.stringify()に渡してJSON文字列に変換しています。typeofで型を見てみると、stringになっているのが分かります。

普段JavaScript内で使用するときはオブジェクトで良いですが、サーバサイドとデータのやり取りをしたい場合は文字列にして送ると非常に簡単です。

さいごに

JSONについて以下の通り解説しましたが、いかがでしたでしょうか。
 ・JSONの特徴
 ・JSONとXMLの違い
 ・JSONの書き方
 ・JSONが対応している型
 ・JSONの使い方

プログラミングをしていれば必ず出会うデータフォーマット(JSON、XML、CSV、…)の問題、この機会に勉強してみてもいいかもしれませんね。

新規CTA

新規CTA
新規CTA

RELATED POST関連記事


RECENT POST「プログラミング」の最新記事


この記事が気に入ったらいいねしよう!