local storage

local storage

• 웹 브라우저에 내장되어 있는 유사 데이터베이스로 item들을 저장할 수 있는 곳이다.
• 웹 브라우저에서 캐시를 삭제하지 않는 이상, local storage에 정보가 유지된다.

Web Storage

웹 스토리지에는 Local Storage와 Session Storage가 있따.

• Local Storage : 웹 브라우저가 닫힌 이후에도 만료 기간없이 저장되는 공간
• Session Storage : 웹 브라우저가 닫힌 이후 저장되어있던 데이터가 삭제되는 공간

local storage method

key,value 를 쓸 땐 string 타입으로 작성한다.

• setItem() : local storage에 key, value를 추가

  • localStorage.setItem('key', 'value')

• getItem() : key를 이용해 value를 검색 후 가져온다.

  • localStorage.getItem('key')

• removeItem() : key를 이용해 데이터를 제거

  • localStorage.removeItem('key')

• clear() : storage를 clear

  • localStorage.clear()

localStorage 특징

localStorage는 string타입으로 값을 다룬다. 따라서 데이터를 저장할 때와 가져올 때 string타입으로 변환하고 다시 복원하는 과정이 필요하다.

• JSON.stringify() : data array -> string 으로 변환

  • localStorage.setItem('items', JSON.stringify(itemsArray))

• JSON.parse() : localStorage에 있는 데이터를 다룰 수 있는 data 타입으로 변환한다.

  • const data = JSON.parse(localStorage.getItem('items'))