- 참고 https://goddino.tistory.com/207
- 쿠키와 세션 https://seo-developer.tistory.com/58
- 요약: 로컬 스토리지는 웹 닫을때 삭제되는 임시 저장소
0. JSON 형식이 뭔지
https://developer.mozilla.org/ko/docs/Learn/JavaScript/Objects/JSON
- Javascript 객체 문법으로 구조화된 데이터를 표현하기 위한 문자 기반의 표준 포맷
- { "key: "value", "key_2": "value_2" ... } 이런 식으로 생겼음
1. localStorage 에 저장하기
- localStorage.setItem("key이름", "value내용");
-> 저장
- localStorage.getItem("key이름");
-> key 값이 일치하는 데이터의 value 반환
- localStorage.removeItem("key이름");
-> key 값이 일치하는 데이터 삭제
- localStorage.clear();
-> 로컬스토리지 전체 비우기
2. JSON -> string
const setLocalStorage = { type: type, option: this.equipOption } localStorage.setItem("simulation_data", JSON.stringify(setLocalStorage)); |
- 이런식으로 저장된다.
- key 하나에 담긴 데이터를 배열처럼 다룰 수 있어 편하다.
2-1. 왜 string 형식으로 변환해야 합니까?
- 로컬 스토리지에 저장할때 value 는 string, 문자열만 읽을 수 있다.
- 그냥 상개발자 답게 JSON 때려박아도 안박힘.
3. string -> JSON
- 반대로 로컬스토리지에 저장된 string 형식의 value 를 다시 JSON 형식으로 변환하려면
const getItem = localStorage.getItem("simulation_data"); console.log(JSON.parse(getItem)) |
- 잘된다!
- 1). 로컬 스토리지에서 getItem 을 통해 문자열을 가져온다.
- 2). 가져온 문자열을 JSON.parse() 을 통해 JSON 형식으로 변환한다.
