JSON.stringify()

❮ 前章へ 次章へ ❯

JSONの一般的な使い方は、Webサーバとの間でデータを交換することです。

Webサーバにデータを送信する場合、データは文字列でなければなりません。

JSON.stringify()でJavaScriptオブジェクトを文字列に変換します。


JavaScriptオブジェクトを文字列化する

JavaScriptで次のオブジェクトがあったとします:

var obj = { "name":"John", "age":30, "city":"New York"};

JavaScript関数のJSON.stringify()を使用して、これを文字列に変換します。

var myJSON = JSON.stringify(obj);

結果は、JSON表記に従う文字列になります。

これで、myJSONは文字列になり、サーバに送信する準備が整ったことになります:

var obj = { "name":"John", "age":30, "city":"New York"};
var myJSON = JSON.stringify(obj);
document.getElementById("demo").innerHTML = myJSON;
Try it Yourself »

JSONをサーバに送信する方法については、次の章で学習します。


JavaScript配列を文字列化する

JavaScript配列を文字列化することもできます:

JavaScript形式の次の配列があったとします:

var arr = [ "John", "Peter", "Sally", "Jane" ];

JavaScript関数のJSON.stringify()を使用して文字列に変換します。

var myJSON = JSON.stringify(arr);

結果は、JSON表記に従う文字列になります。

これで、myJSONは文字列になり、サーバに送信する準備が整ったことになります:

var arr = [ "John", "Peter", "Sally", "Jane" ];
var myJSON = JSON.stringify(arr);
document.getElementById("demo").innerHTML = myJSON;
Try it Yourself »

JSONをサーバに送信する方法については、次の章で学習します。


例外

日付を文字列化する

JSONでは、日付オブジェクトは使用できません。 JSON.stringify()関数は、全ての日付を文字列に変換します。

var obj = { "name":"John", "today":new Date(), "city":"New York"};
var myJSON = JSON.stringify(obj);

document.getElementById("demo").innerHTML = myJSON;
Try it Yourself »

文字列をレシーバの日付オブジェクトに変換することができます。


Stringify 関数

JSONでは、関数はオブジェクトの値として使用できません。

JSON.stringify()関数は、JavaScriptオブジェクトから関数とキーと値の両方を削除します:

var obj = { "name":"John", "age":function () {return 30;}, "city":"New York"};
var myJSON = JSON.stringify(obj);

document.getElementById("demo").innerHTML = myJSON;
Try it Yourself »

これは、JSON.stringify()関数を実行する前に関数を文字列に変換する場合は省略できます。

var obj = { "name":"John", "age":function () {return 30;}, "city":"New York"};
obj.age = obj.age.toString();
var myJSON = JSON.stringify(obj);

document.getElementById("demo").innerHTML = myJSON;
Try it Yourself »

JSONで関数を使うのは避けるべきです。関数はスコープを失い、eval()を使って関数に変換する必要があります。


ブラウザ・サポート

JSON.stringify()関数は、すべての主要なブラウザと最新のECMAScript(JavaScript)標準に含まれています:

Web ブラウザ・サポート
  • Firefox 3.5
  • Internet Explorer 8
  • Chrome
  • Opera 10
  • Safari 4


❮ 前章へ 次章へ ❯