[2022]Local Storage 알아보기

Local Storage는 웹브라우저에 있는 작은 DB라고 생각하면 되는데

 

우선 개발자 도구 들어가서 직접 저장된 데이터를 확인할 수 있다.

 

개발자도구

 

왼쪽 보면 Storage 아래에 Local Storage를 확인할 수 있는데 

Storage

 

 

처음에는 저장된 것이 없으니 Key와 Value 값이 모두 비어있는 게 정상이다.

 

 

값을 채워넣기 위해서는 텍스트 에디터를 이용해서 Key와 Value값을 넣어줄 수 있는데

localStorage.setItem(key, value);

 

 

직접 개발자도구에 있는 Console에서 저장할 수 있는데

Web browser Console

값을 입력하면 undefined라고 나오는데 상관없다.

 

 

 

 

 

 

 

저장된 것을 확인했으면 꺼내는 방법은 아래와 같다.

주의할 점은 ""큰 따옴표 안에 Key의 이름을 그대로 입력해야 Value를 꺼낼 수 있다.

localStorage.getItem(key);