- PR -

JSONオブジェクトについて

1
投稿者投稿内容
ゆいたん
ベテラン
会議室デビュー日: 2004/08/26
投稿数: 91
投稿日時: 2005-11-15 23:23
http://www.kawa.net/works/js/jkl/hina.html

こちらを参考にajaxの学習をしています。
JKL.HinaへのJSONオブジェクトの投入のところで躓いています。
環境はサーバーがIIS5.0、ClientがIE6.0SP2です。

コード:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<title>ajax</title>
<script type="text/javascript" src="./jkl-parsexml.js"></script>
<script type="text/javascript" src="./jkl-hina.js"></script>
<script type="text/javascript" src="./jkl-dumper.js"></script>
<script><!--
var testArray = {
	table1: [
		{ ID: 1, Name: "aaa", Amount: 1000 },
		{ ID: 2, Name: "bbb", Amount: 2000 },
		{ ID: 3, Name: "ccc", Amount: 3000 }
	] 
};
function doSampleCase() {
	document.all("src").style.display = "block";
	var hina = new JKL.Hina( "src" );
	alert(testArray); //JSONオブジェクト
	hina.expand( testArray, "dest" );
	document.all("src").style.display = "none";
}
function doTestCase(){
	// CSVファイルの取得、取得後2次元配列に変換
	var url = "data.csv";
	var http = new JKL.ParseXML.CSVmap( url );
	var dataArray = http.parse();
	alert(dataArray); //2次元配列のオブジェクト
	// JSON形式(String?)に変換
	var dumper = new JKL.Dumper();
	var jsonArray = dumper.dump( dataArray );
	alert(jsonArray); //JSON形式のString
	// JSON形式(Object?)に変換してJKL.Hinaに投入
	document.all("src").style.display = "block";
	var hina = new JKL.Hina( "src" );
	hina.expand( eval(jsonArray), "dest" );
	document.all("src").style.display = "none";
}
// --></script>
<style>
</style>
</head>
<body>
<a href="javascript:doSampleCase();void(0);">doSampleCase</a><br>
<a href="javascript:doTestCase();void(0);">doTestCase</a><br>
<div id="src" style="display:none">
	<table border="1">
		<tr><th>ID</th><th>Name</th><th>Amount</th></tr>
		<tr title="@foreach line1 [/table1]">
		<td>[/line1/ID]</td>
		<td>[/line1/Name]</td>
		<td>[/line1/Amount]</td>
		</tr>
	</table>
</div>
<div id="dest">
</div>
</body>
</html>



doSampleCaseのリンクをクリックすると正常に動作します。
# testArrayの内容がきちんと表示されます。
doTestCaseのリンクをクリックすると内容が表示されません。

1.doSampleCase内のalert(testArray)ではObjectが返ってきます。
# JKL.Hinaに投入するのはObject型でないとNGと推測
2.doTestCase内のalert(dataArray)ではObject×3が返ってきます。
# 正しくCSVが2次元配列になっていると推測
3.doTestCase内のalert(jsonArray)ではJSON形式のデータが表示されます。
# JSONチックには変わっているのは確認

上記の現象から、JSONオブジェクト型になっていないと推測し、
hina.expand( eval(jsonArray), "dest" );
のようにeval関数でjsonArrayを囲んでJKL.Hinaに引き渡しました。
# ここが自信ありません。検索してみたのですがうまく引っ掛けられませんでした。

おそらく、JSONオブジェクト型の作り方が間違っているか
1.にあって3.にないtable1:という値?属性?(呼び名がわかりません?)が
ないためにNGになっていると考えています。

何かヒントがありましたら、ご提示ください。
よろしくお願いいたします。

以上
ゆいたん
ベテラン
会議室デビュー日: 2004/08/26
投稿数: 91
投稿日時: 2005-11-16 13:53
いろいろ調べた結果、evalへの引数は式で入れなければならないらしいとの
ことで、一応動くようになりました。

コード:
// 誤
hina.expand( eval(jsonArray), "dest" );
// 正
hina.expand( eval("obj={table1:" + jsonArray + "}"), "dest" );



ここで疑問なのですが、obj=とか適当につけてしまったのですが、
ここはどんな意味を持つのでしょうか。

お分かりになる方がいらっしゃいましたら、教えてください。
nak2k
ベテラン
会議室デビュー日: 2003/07/17
投稿数: 86
投稿日時: 2005-11-16 14:33
eval に渡した文字列は、その箇所にその文字列のJavaScriptコードを
直接記入したのとほぼ同じことになります。そのため、
コード:

hina.expand( eval("obj={table1:" + jsonArray + "}"), "dest" );

hina.expand((obj={table1: /* ここにjsonArrayの内容 */}), "dest" );


と同じことになります。

結果、変数objにjsonArrayに従ったArrayインスタンスを値に持つ
プロパティtable1を持ったオブジェクトが代入され、そのオブジェクトが
hina.expandの第1引数の実引数として渡されます。

"obj="をつけたことでローカル変数名空間にobjという名前が
発生してしまっていますので、変数名空間の汚染を最小に
するには、"obj="よりも"0,"とでもつけたほうがいいと思います。


[ メッセージ編集済み 編集者: nak2k 編集日時 2005-11-16 14:34 ]
ゆいたん
ベテラン
会議室デビュー日: 2004/08/26
投稿数: 91
投稿日時: 2005-11-16 14:44
nak2kさんありがとうございます。

私の当初やっていた方法だと、後続でobjという変数を使って処理できる
という理解をしました。なお、当該スクリプトは0,の指定でもうまく行きました。

evalやJavaScriptにおける式の考え方などもう少し検索して勉強してみます。

1

スキルアップ/キャリアアップ(JOB@IT)