4.1 JSON

在 javascript/practice 資料夾下，建立 json.html 來練習。

JSON.stringify()

這裡舉一個本地端儲存(localStorage)的例子(以下寫法是錯的)：

var my_obj = {
  test1: "文字一",
  test2: "文字二"
};
console.log(my_obj); // {test1: "文字一", test2: "文字二"}

localStorage.setItem("my_key", my_obj);

上述原始碼的第7行，執行完的結果，如下圖：

這樣結果是錯的，對 localStorage 來說，我們要存的是字串才行。

所以我們需要將 JSON 物件給字串化( JSON.stringify() )，如下(以下寫法才是正確的)：

var my_obj = {
  test1: "文字一",
  test2: "文字二"
};
console.log(my_obj); // {test1: "文字一", test2: "文字二"}

localStorage.setItem("my_key", JSON.stringify(my_obj));

結果如下圖：

JSON.parse()

將物件字串，轉回成真實的物件：

var my_data_str = localStorage.getItem("my_key");
var my_data_obj = JSON.parse(my_data_str); // 轉回真實的物件

console.log(my_data_obj); // {test1: "文字一", test2: "文字二"}