Window.localStorage

• localStorage 객체는 브라우저에서 key/value 쌍을 저장할 수 있습니다.

• localStorage 객체는 만료 날짜가 없는 데이터를 저장합니다.

• 데이터는 브라우저가 종료될 때 삭제되지 않으며, 추후 세션에서 이용 가능합니다.

문법

window.localStorage or localStorage

Save Data to Local Storage

localStorage.setItem(key, value);

Read Data from Local Storage

let lastname = localStorage.getItem(key);

Remove Data from Local Storage

localStorage.removeItem(key);

Remove All (Clear Local Storage)

localStorage.clear();

Parameters

Parameter	Description
key	Key의 이름이 요구됩니다.
value	Key의 value가 요구됩니다.

Window.sessionStorage

• sessionStorage 객체를 사용하면 브라우저에 key/value 쌍을 저장할 수 있습니다.

• sessionStorage 객체는 하나의 세션에 대한 데이터만 저장합니다.

• 데이터는 브라우저가 종료될 때 삭제됩니다.

문법

window.sessionStorage or sessionStorage

Save Data to Session Storage

sessionStorage.setItem("key", "value");

Read Data from Session Storage

let lastname = sessionStorage.getItem("key");

Remove Data from Session Storage

sessionStorage.removeItem("key");

Remove All (Clear session Storage)

sessionStorage.clear();

Parameters

Parameter	Description
key	Key의 이름이 요구됩니다.
value	Key의 value가 요구됩니다.

localStorage와 sessionStorage의 차이

localStorage: 브라우저를 종료했다 다시 실행해도 남아있습니다.

sessionStorage: 페이지를 새로고침 해도 남아있습니다. 하지만 탭이나 브라우저를 종료하면 사라집니다.

reference
https://ko.javascript.info/localstorage
https://developer.mozilla.org/ko/docs/Web/API/Window/localStorage
https://developer.mozilla.org/ko/docs/Web/API/Window/sessionStorage)
https://www.w3schools.com/jsref/prop_win_localstorage.asp
https://www.w3schools.com/jsref/prop_win_sessionstorage.asp