2
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

JSONとは

Posted at

JSONとは

JavaScript Object Notationの略でデータフォーマットの種類です。
web技術で、データ通信(APIとか)をする際によく利用されます。
オブジェクトの中身はkey:valueの形で表現されます。

特徴

  • 複雑なデータ構造でも簡単に表現できる
  • xmlなどと比較してデータ量が小さい
  • JavaScriptで使いやすいデータ形式

複雑なデータ構造でも簡単に表現できる

基本的に、JSONではかっこを使ってデータ型を表現します。
基本的に、以下のかっこしか使いません。
これを組み合わせることで、複雑なデータ構造も表現します。

  • オブジェクト:{}
  • 配列:[]

{}が出てきたら、「これはオブジェクトだな」、
[]が出てきたら、「これは配列だな」と考えればOKです。

xmlなどと比較してデータ量が小さい

以下はkeyがdata、valueがhogeのデータをそれぞれのデータ形式で表現したものです。

xml形式の場合

<data>hoge</data>

json形式の場合

{"data": "hoge"}

xmlではvalueを<key>で囲っているので、その分データが冗長です。

JavaScriptで使いやすいデータ形式

JSONはJavaScriptで扱うデータと全く同じ構造をしています。

例を見るのが一番わかりやすいと思います。
skillを配列で持った、オブジェクトをJSONで表現すると、以下のようになります。

{
  "name": "yamada",
  "age": 24,
  "skills": [
    {"language":"html", "type": "frontend"},
    {"language": "css", "type": "frontend"},
    {"language": "php", "type": "backend"}
  ],
  "description": "webエンジニアの山田さん"
}

JavaScriptで扱うときは、データを変数に入れて利用することが多いため、
dataという変数に上のデータを入れた場合、以下のような使い方ができます。


console.log(data.name);                // yamada
console.log(data.age);                 // 24
console.log(data.skills[1].language);  // css
2
3
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?