JSON .parse（）
JSONの一般的な使用法は、Webサーバーとの間でデータを交換することです。
Webサーバーからデータを受信する場合、データは常に文字列です。
でデータを解析するJSON.parse()と、データはJavaScriptオブジェクトになります。
例-JSONの解析
Webサーバーからこのテキストを受け取ったと想像してください。
'{"name":"John", "age":30, "city":"New York"}'
JavaScript関数JSON.parse()を使用して、テキストをJavaScriptオブジェクトに変換します。
const obj = JSON.parse('{"name":"John", "age":30, "city":"New
York"}');
テキストがJSON形式であることを確認してください。そうでない場合、構文エラーが発生します。
ページでJavaScriptオブジェクトを使用します。
例
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML = obj.name;
</script>
JSONとしての配列
配列から派生したJSONでを使用する場合JSON.parse()、メソッドはJavaScriptオブジェクトではなくJavaScript配列を返します。
例
const text = '["Ford", "BMW", "Audi", "Fiat"]';
const myArr = JSON.parse(text);
例外
日付の解析
日付オブジェクトはJSONでは許可されていません。
日付を含める必要がある場合は、文字列として記述します。
後で日付オブジェクトに戻すことができます。
例
文字列を日付に変換します。
const text =
'{"name":"John", "birth":"1986-12-14", "city":"New York"}';
const obj = JSON.parse(text);
obj.birth = new Date(obj.birth);
document.getElementById("demo").innerHTML = obj.name + ", " + obj.birth;
または、JSON.parse()関数の2番目のパラメーターであるreviverを使用できます。
reviverパラメーターは、値を返す前に各プロパティをチェックする関数です。
例
reviver関数を使用して、文字列を日付に変換します。
const text =
'{"name":"John", "birth":"1986-12-14", "city":"New York"}';
const obj = JSON.parse(text, function (key, value) {
if
(key == "birth") {
return new
Date(value);
} else {
return value;
}
});
document.getElementById("demo").innerHTML = obj.name + ", " + obj.birth;
関数の解析
JSONでは関数は許可されていません。
関数を含める必要がある場合は、文字列として記述します。
後で関数に戻すことができます。
例
文字列を関数に変換します。
const text =
'{"name":"John", "age":"function () {return
30;}", "city":"New York"}';
const obj = JSON.parse(text);
obj.age = eval("(" + obj.age + ")");
document.getElementById("demo").innerHTML = obj.name + ", " +
obj.age();
JSONで関数を使用することは避けてください。関数はスコープを失い、関数にeval()戻すためにを使用する必要があります。