목표
Local/Session Storage 사용법을 익히고, Object/Array와 JSON 간 쌍방 형식 변환을 수행한다.
Local Storage : 반영구적으로 데이터를 저장함
Session Storage : 휘발성 저장소, 새로고침하거나 브라우져 껏다 켜면 저장시켜놓은 데이터가 사라짐
위와 같이 개발자 모드(F12)에서 Local Storage에 데이터를 저장하고 삭제할 수 있다.
Session Storage에 저장하고 싶다면, 위의 localStorate 대신 sesseionStorage로 작성한다.
코드에서 Object/Array 데이터를 JSON 형식으로 Local Storage에 저장하기
function App() {
let obj = {name : 'kim'}
localStorage.setItem('data', JSON.stringify(obj))
let json = localStorage.getItem('data')
console.log(JSON.parse(json).name)
...(생략)...
}
JSON.stringify() 함수를 통해 object/array -> JSON 형식으로 데이터가 변환시킬 수 있다.
Application의 Local Storage를 확인하면 JSON 형식으로 저장된 것을 확인할 수 있다.
또 JSON.parse() 함수를 사용하면 반대로 JSON -> object/array 형식으로 변환시킬 수 있다.
변환시킨 데이터를 통해 .name이라는 키워드를 사용해 데이터에 접근이 가능해진 모습이다.
