JS 筆記 - JSON.parse, JSON.stringify

JSON 資料很容易使用到這兩個屬性，因 localstorage 只會存入 string 資料，故要把 JSON 資料轉換成可以存取的值，需要使用以下兩個語法:

• JSON.stringify(): 將 array 轉為 string。
• JSON.parse(): 將 sring 轉為 array。

目前下方有一個 JSON 資料:

var data = [
  {
    team: "BULLS",
    player: "Pippen",
  },
  {
    team: "JAZZ",
    player: "Stockton",
  },
];

先把資料轉成字串存入 localstorage:

var dataString = JSON.stringify(data); //將資料轉成 string
console.log(dataString); //確認是否有抓到 data
localStorage.setItem("data", dataString); //存入 key 為 data, value 為dataString
console.log(localStorage.getItem(data)); // 確認可取出 data 資料

需要使用時，再把資料轉成 Array 資料，並取出資料中第一筆 player 資料:

var getData = localStorage.getItem("data"); //取出資料
var getDataAry = JSON.parse(getData); //轉型為 array
console.log(getDataAry[0].player); //確認可取出第一筆的 player 資料，Pippen

codepen: https://codepen.io/hnzxewqw/pen/rNVwGOX

可透過 console 與 Application 檢查。