JSONフォーマットの表示形式をもっと便利にコントロールする方法

2021年6月13日

テクノロジー

eyecatch 他の人がやらない技術に魅力を感じてしまう、弓削田です。 JSONフォーマットが便利すぎて、データベースを使わない解析サイトを作り続けて10年以上になってきました。 当時はNO-SQLという言葉も無く、既存のデータベースモジュールの精度が気に入らなくてひたすら自分なりのデータの扱いを追求してきた結果なんですが、 改めてJSONフォーマットって、非常に優れていると言い切れます。 そんなJSONデータのフォーマットで、もう少し便利にならないかと考えて、今回スニペットを作ってみました。 似たようなことやっている人がいたら、便利に使ってもらえると思います。 あ、ちなみに、javascriptでのスニペットにしているので、webサイトでの管理画面などで使ってください。 PHPや他の言語で扱う場合は、移植するのがしんどいかもしれません・・・

JSONフォーマットの表示について

次のようなデータを作ったとします。 var data = [ [0,0,0,0,0], [1,1,1,1,1], [2,2,2,2,2], [3,3,3,3,3] ] これを、JSON.stringify(data);とすると、 [[0,0,0,0,0],[1,1,1,1,1],[2,2,2,2,2],[3,3,3,3,3]] こんな風になってしまいます。 見た目を良くしようと、pretty-print(PHP的な言い方です)オプションでやってみると、 JSON.stringify(data , null , " "); [ [ 0, 0, 0, 0, 0 ], [ 1, 1, 1, 1, 1 ], [ 2, 2, 2, 2, 2 ], [ 3, 3, 3, 3, 3 ] ] こんな風に、インデント処理をしてくれますが、 どちらも見た目も悪ければ、使いづらい形式になってしまいます。

JSONデータも見た目が重要!

ちなみに、jsonを文字列として保持しておけばいいという考え方もありますが、 データ保存する際は、最も文字列の少ない形式で保存して、それを復元する方法がなんとかならないか考えてみました。 今回のデータは、ゲームなどのマップデータで、よく使われる方式で、多重配列階層になっていて、任意の階層の時にのみ pretty-print処理をしないという風にしなければいけないようです。 そこで、次のスニペットを実行してみると・・・ var data = [[0,0,0,0,0],[1,1,1,1,1],[2,2,2,2,2],[3,3,3,3,3]]; var json = JSON.stringify(data , json_replacer , " "); console.log(json); function json_replacer(key , value){ if(check_array_types(value , "number")){ return value.join(","); } else{ return value; } }; function check_array_types(value , type){ if(value.constructor !== Array){return false;} for(let val of value){ if(typeof val !== type){ return false; } } return true; }; 上記を実行すると・・・ [ "0,0,0,0,0", "1,1,1,1,1", "2,2,2,2,2", "3,3,3,3,3" ] 見事に、思ったとおりに結果になりました。 う〜ん、トレビアン!!!!

少し解説

javascriptのJSON.stringify機能は、送り値は、次のようになっています。
・1番目がデータ ・2番めがreplacer ・3番目がインデント
この場合、2番めの処理は、殆どの場合、nullとか、""(ブランク)という書き方をしていますが、 ここに、入ってくるデータを判別して、処理をするという事ができるという風になっています。 ここで、"json_replacer"関数をセットして、その中で、"check_array_types"関数に、値を受け渡して、その値の中がすべて、指定したデータ型(今回の場合は"number")であれば、配列データを返すのではなく、 join(",")した値を返すことで、任意の形式のデータ構成を部分的に改行フォーマットをしないようにすることができます。 javascript特有の書き方なので、別言語で扱う場合は、苦労するかもしれませんが、 入力フォームに書かれたjsonフォーマットの整形変換などに便利に使えると思います。 少なくても、僕の作った管理画面では重宝するので、これで十分。 もっと複雑な判定をさせて、便利なフォーマットに変換してみてもいいかもですね。

最後に

JSONフォーマットとXMLフォーマットって、同じ様にデータベースフォーマットであると考えられていますが、 この2つの違いを簡単に説明してくれと人から言われたら、まあまあ困らないですか? 僕はよくこの質問を企業の採用面談でやっていましたwww

人気の投稿

このブログを検索

ごあいさつ

このWebサイトは、独自思考で我が道を行くユゲタの少し尖った思考のTechブログです。 毎日興味がどんどん切り替わるので、テーマはマルチになっています。 もしかしたらアイデアに困っている人の助けになるかもしれません。

ブログ アーカイブ