구글 크롬 브라우저의 개발자 도구에서 Application 탭을 보면 왼쪽에 Local Storage라고 확인이 된다.로컬 스토리지는 쿠기나 세션과 같이 데이터를 저장하는 장소 중 하나이다. 로컬 스토리지의 데이터 저장 기간은 만료가 없고 항상 문자열로만 저장이 되어야 한다.
메소드
getItem : 로컬 스토리지에 저장되어 있는 데이터 값을 불러오는 메소드
setItem : 로컬 스토리지에 데이터를 저장하는 메소드
const greeting = document.querySelector("h1");
const yourName = localStorage.getItem("name");
if (yourName === null) {
const name = prompt("이름을 입력해주세요.");
localStorage.setItem("name", name);
greeting.innerHTML = `안녕하세요. ${name}`;
} else {
greeting.innerHTML = `안녕하세요. ${yourName}`;
}
Local Storage 에 저장된 Key todos에 Value 가 "apple"과 "banana"임을 알 수 있다.
해당 페이지를 새로 고침해도 로컬 스토리지에 저장된 데이터는 지워지지 않는다.
'JS' 카테고리의 다른 글
(JS) DOM과 Jquery로 짠 코드 간단한 차이 (0) | 2022.02.21 |
---|---|
(Javascript) 정규 표현식 메소드 (0) | 2022.01.06 |
(Javascript) JSON 기본 (0) | 2021.10.20 |
(Javascript 에러) Uncaught SyntaxError: Failed to execute 'querySelector' on 'Document' (0) | 2021.09.27 |
(Javascript) 실행 컨텍스트, 어휘 환경, 클로저 (0) | 2021.09.16 |