■サンプルソース
<head>
<script type="text/javascript">
var jsonObject = {
"name" : "JustOnePlanet",
"blog" : "WordPress",
"language" : ["JavaScript", "PHP", "Perl"],
"num1" : 10,
"num2" : 5,
"boolean1" : true,
"boolean2" : false
}
function test1(){
if(jsonObject.boolean1){
alert("TEST");
}
}
function test2(){
if(jsonObject.boolean2){
alert("TEST");
}
}
</script>
</head>
<body>
<ul>
<li><a href=”javascript:alert(jsonObject.name);”>alert(jsonObject.name);</a></li>
<li><a href=”javascript:alert(jsonObject.blog);”>alert(jsonObject.blog);</a></li>
</ul>
<ul>
<li><a href=”javascript:alert(jsonObject.language[0]);”>alert(jsonObject.language[0]);</a></li>
<li><a href=”javascript:alert(jsonObject.language[1]);”>alert(jsonObject.language[1]);</a></li>
<li><a href=”javascript:alert(jsonObject.language[2]);”>alert(jsonObject.language[2]);</a></li>
</ul>
<ul>
<li><a href=”javascript:alert(jsonObject.num1);”>alert(jsonObject.num1);</a></li>
<li><a href=”javascript:alert(jsonObject.num2);”>alert(jsonObject.num2);</a></li>
<li><a href=”javascript:alert(jsonObject.num1 + jsonObject.num2);”>alert(jsonObject.num1 + jsonObject.num2);</a></li>
</ul>
<ul>
<li><a href=”javascript:test1();”>if(jsonObject.boolean1){alert(”TEST”);}</a></li>
<li><a href=”javascript:test2();”>if(jsonObject.boolean2){alert(”TEST”);}</a></li>
</ul>
</body>
■サンプルを再現
下記、リンクをクリックするとJSONにおいて指定した要素をアラートして表示します
使用するJSONオブジェクト
var jsonObject = {
"name" : "JustOnePlanet",
"blog" : "WordPress",
"language" : ["JavaScript","PHP","Perl"],
"num1" : 10,
"num2" : 5,
"boolean1" : true,
"boolean2" : false
}
JSONから文字列を取り出そう
JSON内の配列から取り出そう
JSONから数値を取り出そう
JSONからブール値を使ってみよう
■基本文法と解説
使用可能な基本型と利用法
- 使える基本型は文字列、数値、ブール値、nullの4つ
- 文字列はダブルクォーテーション(”)で囲まなければいけない。シングルクォーテーションは文字列を囲む際には使えない
- 数値は10進数表記のみ対応
- 数値の先頭に余分な0は表記できず、無限大infinityや非数NaNも使えない
使用可能な構造型
- 使える構造型はオブジェクト、配列の2つ
- オブジェクトは名前と値のセットの集合体である
- オブジェクトの名前は文字列しか許可されない(ex—“name”:“JustOnePlanet”)
- 値は上記使える基本型の全てが使える
- 名前と値の間は:(コロン)で区切られる
- セット(名前:値)の間は,(カンマ)で区切られる(ex—“name”:”JustOnePlanet”,“blog”,”WordPress”)
- 配列は(ex—“配列名”:[“要素0″,”要素1″,”要素2″,”要素3”])のように[]でくくり、,(カンマ)で区切る
その他(今回は知らなくても大丈夫ですが)
- MIMEタイプはapplication/json
- ファイル拡張子は.json
- jsonのみで記述(もしくはレスポンス)する際は、下記のように全体を[]でくくる
[
{
"name" : "JustOnePlanet",
"blog" : "WordPress",
"language" : ["JavaScript", "PHP", "Perl"],
"num1" : 10,
"num2" : 5,
"boolean1" : true,
"boolean2" : false
}
]
XMLよりJSONの方が高速でパースできる。
■参考