웹 스토리지 객체인 locarStorage는 브라우저 내에 키-값 쌍을 저장할 수 있게 해준다.
이를 사용하면 페이지를 새로 고침하고 심지어 브라우저를 다시 실행해도 데이터가 사라지지 않고 남아있다.
로컬 스토리지는 해당 메서드와 프로퍼티를 제공한다.
- setitem(key, value) - 키- 값 쌍의 보관.
- getitem(key) - 키에 해당하는 값을 받아온다.
- removeitem(key) - 키와 해당 값을 삭제.
- clear() - 모든 것을 삭제.
- key(index) - 인덱스에 해당하는 키를 받아온다.
- length - 저장된 항목의 개수를 얻는다.
- setItem(key, value) – 키-값 쌍을 보관합니다.
- getItem(key) – 키에 해당하는 값을 받아옵니다.
- removeItem(key) – 키와 해당 값을 삭제합니다.
- clear() – 모든 것을 삭제합니다.
- key(index) – 인덱스(index)에 해당하는 키를 받아옵니다.
- length – 저장된 항목의 개수를 얻습니다.
로컬스토리지는 맵과 비슷한 점이 있다. 하지만 인덱스를 사용해 키에 접근할 수 있다는 점에서 차이를 갖는다.
로컬스토리지의 주요 기능.
오리진이 같은 경우 데이터는 모든 탭과 창에서 공유된다.
브라우저나 OS가 재시작하더라도 데이터가 파기되지 않는다.
키로 순회하기.
로컬스토리지는 '키'를 사용해 값을 얻고, 설정하고, 삭제할 수 있게 해준다.
전체 값을 얻기 위해선, 이터러블 객체가 아니기 때문에 배열처럼 다루면 전체 키-값을 얻을 수 있다.
(for문을 통한 전체 인덱스 순회, 아니면 Key in문을 통하여 전체 키-값 순회. 후자의 경우 필요하지 않은 내장 필드까지 출력되어
추천되지 않는다.)
문자열만 사용.
로컬스토리지의 키와 값은 반드시 문자열이어야 한다.
숫자나 객체 등 다른 자료형을 사용하게 되면 문자열로 자동 변환된다.
'Web' 카테고리의 다른 글
IPv6 (0) | 2024.05.10 |
---|---|
IP와 포트. (0) | 2024.05.08 |
Import와 export (0) | 2024.05.03 |
Semantic code (0) | 2024.05.02 |
git 사용 중인 문법 정리 (0) | 2024.05.01 |