JSON筆記二：js物件和字串的互相轉換
阿新 • • 發佈：2018-12-11
字串轉js物件程式（JSON.parse()和JSON.eval()使用 ）（一般用於接收從伺服器傳來的json字串）：
<!DOCTYPE html> <meta charset="utf-8"> <html> <body> <p id="id"></p> <p id="id_0"></p> <p id="id_1"></p> <p id="id_2"></p> <p id="id_3"></p> </body> <script> //使用 JSON.parse() 方法將資料轉換為 JavaScript 物件 var data = '{"name":"不見人", "language":"javascript", "text":"測試JSON"}'; var obj = JSON.parse(data); document.getElementById("id").innerHTML = obj.name + "使用" + obj.language + obj.text; //JSON 不能儲存 Date 物件,需要將其轉換為字串。 var data_1 = '{"name":"不見人", "language":"javascript", "text":"測試JSON", "time":"2018-09-22 10:13:30"}'; obj = JSON.parse(data_1); //方法一 //把時間轉成時間戳 var timestamp = Date.parse(new Date(obj.time)); //顯示 時間戳 document.getElementById("id_0").innerHTML = timestamp; //把時間戳轉成時間 var date = new Date(timestamp); document.getElementById("id_1").innerHTML = date; //方法二， JSON.parse 的第二個引數 reviver，一個轉換結果的函式，物件的每個成員呼叫此函式 obj = JSON.parse( data_1, function( key, value ){ if( key == "time" ){ return new Date(value); }else{ return value; } }); document.getElementById("id_2").innerHTML = obj.time; //JSON 不允許包含函式,可以將函式作為字串儲存 var data_2 = '{"name":"不見人", "language":"javascript", "text":"測試JSON", "func":"function() {return true;}"}'; obj = JSON.parse(data_2); // eval() 使用JavaScript 編譯器將 JSON 文字轉換為 JavaScript 物件 //必須把文字包圍在括號中 obj.func = eval("(" + obj.func + ")"); document.getElementById("id_3").innerHTML = obj.func(); </script> </html>
執行結果：
js物件轉為json字串（JSON.stringify()）（一般用於傳送JSON字串到伺服器端）：
<!DOCTYPE html> <meta charset="utf-8"> <html> <body> <p id="id_0"></p> <p id="id_1"></p> <p id="id_2"></p> <p id="id_3"></p> <p id="id_4"></p> </body> <script> //把js物件轉為json字串 var obj = {"name":"不見人", "language":"javascript", "str":"JSON"}; var jsonStr = JSON.stringify(obj); document.getElementById("id_0").innerHTML = jsonStr; //把js陣列轉為json字串 obj = ["不見人","javascript","JSON"]; jsonStr = JSON.stringify(obj); document.getElementById("id_1").innerHTML = jsonStr; //把時間轉為json字串 obj = {"time":new Date}; jsonStr = JSON.stringify(obj); document.getElementById("id_2").innerHTML = jsonStr; //把函式轉為json字串 obj = {"func":function() {return true;}}; //先把函式轉為字串 obj.func = obj.func.toString(); jsonStr = JSON.stringify(obj); document.getElementById("id_3").innerHTML = jsonStr; </script> </html>
執行結果：
JSON.stringify()的函式介面：JSON.stringify(value[, replacer[, space]])
value：是一個js物件。
replacer：可以是函式或者陣列。
space:文字新增縮排、空格和換行符。