JSONとは？わかりやすく解説する！

Web技術

2021.03.19

JSONってなに？

どうやって書くの？

こういった疑問にこたえます。

この記事を読めば

JSONがなにか理解できる
JSONの構造が理解できる
JavaScriptでJSON形式のデータを作成できるようになる

エンジニアの僕がわかりやすく解説します。

JSONとは？

JSON(JavaScript Object Notation)は、標準的なテキストベースの構造化したデータを表すためのデータ記述言語です。

JSONはWeb上でのデータのやり取りによく使われます。

例えば、データをクライアントからサーバへ送信する場合などです。

多くのプログラミング言語ではJSONを読み込んだり、生成する機能があります。

データの構造が決まっていることで色々なアプリケーション間でデータをスムーズにやり取りできるというわけです。

JSONの構造

JSONはJavaScriptオブジェクトによく似たフォーマットを持つ文字列です。

使えるデータ方は以下の表のようになっています。

型	説明
オブジェクト	順序付されていないキーと値のペアの集まり
配列	データのシーケンス
数値	整数、浮動小数点数
文字列	“(ダブルクォーテーション)でくくった文字列
真偽値	true,false
null	null

JSONで使える型

JSONで記述したデータを以下に示します。

JavaScriptオブジェクトによく似たフォーマットであることがわかると思います。

{
  "チーム名": "ファイターズ",
  "本拠地": "北海道",
  "メンバー": [
    {
      "名前": "田中",
      "年齢": 19,
      "好きな食べ物": [
        "カレー",
        "オムライス",
        "たこ焼き"
      ]
    },
    {
      "名前": "鈴木",
      "年齢": 17,
      "好きな食べ物": [
        "コロッケ",
        "さつまいも"
      ]
    },
    {
      "名前": "佐藤",
      "年齢": 18,
      "好きな食べ物": [
        "焼肉",
        "トマト"
      ]
    }
  ]
}

作成したJSONの構文が正しいか確かめることができるサイトがありますので、ぜひ試してみてください。

JSON Pretty Linter - JSONの整形と構文チェック

オンライン上でJSONを確認できるwebサービス。jqコマンド、整形、ソート、フィルター、ユニコード...

JavaScriptでJSON形式のデータを作成する方法

ここでは、JavaScriptでJSON形式のデータを作成する方法を簡単なコードで紹介します。

JSON.stringify()メソッドを使えば簡単にJSON形式のデータを作成することができます。

let person = { name: '田中', age: 25};
console.log(JSON.stringify(person));

//output: "{"name":"田中","age":25}"

このように、オブジェクトを簡単にJSON形式のデータに変換することができました。

Ajax通信をする場合など、JSON形式でデータをやり取りすることが出てきますのでぜひ覚えておきましょう。

JSONとは？まとめ

解説の内容をまとめます。

JSONは構造化したデータを表すためのデータ記述言語
JSONを使えば色々なアプリケーション間でデータをスムーズにやり取りできる

Webシステムでよく使うデータ形式です。

ぜひ覚えておきましょう。