[Javascript] localStorage

임유정·2023년 5월 17일
0
post-thumbnail

localStorage

localStorage를 사용하면, 브라우저에 key-value 값을 Storage에 저장할 수 있습니다.

저장한 데이터는 세션간에 공유됩니다.

즉, 세션이 바뀌어도 저장한 데이터가 유지됩니다.

localStorage를 사용 방법

  • setItem() - key, value 추가
  • getItem() - value 읽어 오기
  • removeItem() - item 삭제
  • clear() - 도메인 내의 localStorage 값 삭제
  • length - 전체 item 갯수
  • key() - index로 key값 찾기

localStorage에 아이템 추가, 읽기

setItem()

localStorage에 아이템을 추가하기 위해서는 setItem() 함수를 사용합니다.

window.localStorage.setItem(key, value)

getItem()

localStorage의 아이템을 읽기 위해서는 getItem() 함수를 사용합니다.

window.localStorage.getItem(key)

window.localStorage.setItem('name', 'youjung');

window.localStorage.setItem('age', '20');

setItem() 함수를 사용하여 localStorage에 key-value 를 저장합니다.

localStorage에는 문자열만을 저장할 수 있습니다.

따라서, 20을 숫자로 저장하더라도, 문자열로 저장됩니다.

window.localStorage.getItem('name');

window.localStorage.getItem('age');

getItem() 함수에 key를 전달하여

localStorage에 저장된 값을 읽어왔습니다.

localStorage에 값 삭제하기

removeItem()
window.localStorage.removeItem(key);

localStorage에 값 전체 삭제하기

clear()
window.localStorage.clear();

localStorage의 아이템 갯수 구하기

length
window.localStorage.length;

localStorage의 key 이름 찾기

key()
window.localStorage.key(index);

profile
console.log(youjung(🌼 , 🍣)); // true

0개의 댓글