localStorage

Window.localStorage

 

• 웹 브라우저 로컬 저장 공간에 데이터를 저장하고 관리할 수 있는 storage 객체
• key-value(JSON 형식)으로 값을 저장
• 만료기간이 존재하지 않으며 페이지 변경, 브라우저 종료 시에도 반영구적으로 유지됨
• 도메인이 다른 경우 로컬스토리지 공유 불가

 

 

localStorage 메서드

 

데이터 저장

localstorage.setItem(keyname, keyValue)

key-value 쌍으로 인자를 받아 데이터를 저장하고 어떤 데이터 타입이던 키 값 모두 문자열로 변환된다.

key-value 형식으로 풀어서 여러 개를 저장할 수도 있지만, 객체를 통째로 저장 시 JSON.stringify() 로 객체를 그대로 문자열화 해줘야함

*JSON.stringify : 자바스크립트 객체를 JSON 형식으로 변환

 

데이터 조회

localstorage.getItem(keyname)

localStorage.setItem( ); 으로 저장한 데이터를 가져올 수 있다. 인자로는 key 를 넣어줌
JSON.stringify()를 통해 객체형식으로 저장했다면, 조회할 때는 JSON.parse()를 해주어야한다.

*JSON.parse : JSON 형식의 텍스트를 자바스크립트 객체로 변환

 

localstorage.key(index)

인덱스로 value를 가져올 수 있음

 

데이터 삭제

key를 넣어주면 해당 데이터 삭제

localstorage.removeItem(keyname)

 

모든 데이터 삭제

localstorage.clear()