JavaScript

JSON.stringify() の引数に関する忘備録

投稿日:2019年10月23日 更新日:

1. JSON.stringify() の第二引数と第三引数

JavaScript でよく使う JSON.stringify()メソッドですが、第二引数と第三引数の意味を忘れがちなので本ページに記録しておきます。

2. 第二引数と第三引数を用いたコード例

実際のコードを見た方がすぐに思い出せると思うので、よく使いそうなコード例を記載します。

第一引数のみ

JSON.stringify({ x: 5, y: 6, z: 7 })
// '{"x":5,"y":6, "z":7}'

オブジェクトをJSON文字列にして出力します。

第二引数を追加する

第二引数の目的は、第一引数で指定したオブジェクトの「置き換え」です。出力する項目のプロパティ名を配列で指定したり、置き換え操作を行う関数を指定することもできます。

JSON.stringify({ x: 5, y: 6, z: 7 }, ['x', 'z'])
// '{"x":5,"z":7}'

ここでは 第二引数に ['x', 'z'] をセットすることによって、第一引数で指定したオブジェクトのうち、プロパティが 'x' もしくは 'z' になっている項目のみを出力しています。

第三引数を追加する

第三引数では、出力フォーマットにおけるインデントの部分を操作することができます。数値を指定すれば、その数のスペースで各項目がインデントされますし、文字列を指定すればインデントとしてその文字が利用されます。

JSON.stringify({ x: 5, y: 6, z: 7 }, ['x', 'z'], 2)
// '{
//   "x":5,
//   "z":7
// }'

ここでは 2 を指定することによって、各項目の左側に2つ分のスペースが出力されています。

3. 参考

📂-JavaScript

執筆者:labo


comment

メールアドレスが公開されることはありません。

関連記事

JavaScript

Luminous を使ってみる

ウェブページ上の画像をポップアップ表示する JavaScript ライブラリである Luminous の使い方について説明します。

JavaScript

Node.js のバージョン管理ツール nvm の使い方

目次1. nvm とは?2. nvm の導入1. すでに nvm がインストールされているかチェックする2. nvm をインストールします3. Node.js のインストール4. nvm の便利なコマ …

JavaScript

【JavaScript】 async / await の使い方

本サイトの JavaScriptで一定時間待ってから処理を開始する方法 でも少し使ったのですが、JavaScript の async / await の使い方についてこちらのページにまとめておきます。 …

JavaScript

JavaScript の静的インポートと動的インポート

目次1. JavaScript の 2種類のインポート機能(概要)1. モジュール側2. 呼び出し側静的インポート動的インポート2. 静的インポート1. この機能の呼び名2. 特徴3. 仕様4. ブラ …

JavaScript

【JavaScript】無名関数とアロー関数とイベントリスナーのthis

目次1. はじめに2. イベントリスナーの登録無名関数を使う場合アロー関数を使う場合3. まとめ4. 参考 1. はじめに あるHTMLにおいて、以下のようにボタンが存在しており、このボタンのクリック …