浜松のWEBシステム開発・スマートフォンアプリ開発・RTK-GNSS関連の開発はお任せください
株式会社シーポイントラボ
TEL:053-543-9889
営業時間:9:00~18:00(月〜金)
住所:静岡県浜松市中区富塚町1933-1 佐鳴湖パークタウンサウス2F

【javascript】JSON.stringify()でjsonを文字列に変換する方法

自分のための備忘録ということで今回はjson.stringify()の使い方をちょこっと書いていきます。

javascriptでjsonファイルを扱ってあれこれするということはよくあります。というのも自分は今まで

あまり意識せず(理解をあいまいにして)使っていました。でもなあなあにしていると後で困るかなと思い

jsonを成形するときに使うであろうjson.stringify()の使い方をさくっとおさらいすることにしました。

 


console.log(JSON.stringify({ num: 5, class: 1 }));

{"num":5,"class":6}

基本的な動きとしてはこんな感じ。

またJSON.stringify()は、三つまで引数を指定することができます。一つ目は成形対象のオブジェクト、

二つ目はコールバック(決められたタイミングで発火する関数)

三つめはインテントを指定することができます。

例えば

<div id="crayon-5d5ba94fea7ae091061679-1" class="crayon-line">const <span class="crayon-i">json_obj</span> = <span class="crayon-sy">{</span><span class="crayon-s">"ID"</span><span class="crayon-sy">:</span> <span class="crayon-cn">1</span><span class="crayon-sy">,</span><span class="crayon-s">"name"</span><span class="crayon-sy">:</span> <span class="crayon-s">"asaba"</span><span class="crayon-sy">,</span><span class="crayon-s">"gender"</span><span class="crayon-sy">:</span> <span class="crayon-s">"male"</span><span class="crayon-sy">}</span></div>
<div id="crayon-5d5ba94fea7ae091061679-2" class="crayon-line crayon-striped-line"></div>
<div id="crayon-5d5ba94fea7ae091061679-3" class="crayon-line"><span class="crayon-t">const</span> <span class="crayon-i">decoded_json</span> = <span class="crayon-i">JSON</span><span class="crayon-sy">.</span><span class="crayon-e">stringify</span><span class="crayon-sy">(</span><span class="crayon-i">json_obj</span><span class="crayon-sy">,</span> <span class="crayon-t">null</span><span class="crayon-sy">,</span> <span class="crayon-s">" 2"</span><span class="crayon-sy">)</span></div>
<div id="crayon-5d5ba94fea7ae091061679-4" class="crayon-line crayon-striped-line"><span class="crayon-i">console</span><span class="crayon-sy">.</span><span class="crayon-e">log</span><span class="crayon-sy">(</span><span class="crayon-i">decoded_json</span><span class="crayon-sy">)</span></div>

 

第三引数に2を指定していますが、ここではインテントを2つ付与するという意味になります。

つまり、成形されたjson全てにインテントがついて出力されます。

 

<div id="crayon-5d5ba94fea7b5405248571-1" class="crayon-line"><span class="crayon-sy">{</span></div>
<div class="crayon-line"><span class="crayon-s">  "ID"</span><span class="crayon-sy">:</span> <span class="crayon-cn">1</span><span class="crayon-sy">,</span></div>
<div id="crayon-5d5ba94fea7b5405248571-3" class="crayon-line"><span class="crayon-h">  </span><span class="crayon-s">"name"</span><span class="crayon-sy">:</span> <span class="crayon-s">"asaba"</span><span class="crayon-sy">,</span></div>
<div id="crayon-5d5ba94fea7b5405248571-4" class="crayon-line crayon-striped-line"><span class="crayon-h">  </span><span class="crayon-s">"gender"</span><span class="crayon-sy">:</span> <span class="crayon-s">"male"</span></div>
<div id="crayon-5d5ba94fea7b5405248571-5" class="crayon-line"><span class="crayon-sy">}</span></div>

このように、第三引数を上手く使うことで整列された文字列を作ることができます。

こんな感じですがおさらい終了になります。

※夏休みボケで色々忘れていそうですが気合で乗り切ります。それでは!

 

  • この記事いいね! (0)