localStorage란?

로컬 저장소를 사용하면 사용자가 페이지를 새로 고치거나 닫을 때에도 브라우저에 저장된 데이터를 저장할 수 있습니다. JavaScript에서 Local Storage가 무엇인지 자세히 알아봅시다.


로컬 스토리지는 2 - 100MB 이상의 데이터를 보유합니다. string(JSON) format에 모든 데이터를 저장했습니다. 웹 인터페이스 데이터에도 유용합니다. 데이터의 오프라인 저장에도 사용됩니다.

그것은 3 가지 방법의 3 가지 유형이 있습니다

데이터 읽기

데이터 쓰기

데이터 삭제

행동 양식

setItem(k,v) - 로컬 저장소에 키 및 값 추가

getItem(k) - 키로 값 검색

removeItem(k) - 키로 항목 제거

clear() - 모든 저장소 지우기

setItem()

let itemsArray = {
   id: "OWUAIJFNSOTEKSMJUFTHDSUQ", 
   name: "Rahul"
 }
 localStorage.setItem('items', JSON.stringify(itemsArray)); 

getItem()

const data = JSON.parse(localStorage.getItem('items')); 
console.log(data); 

참고: JSON.parse()는 localStorage의 내용을 나중에 데이터 변수에서 사용할 수 있는 것으로 변환하는 데 사용됩니다.

항목 제거()

키 이름이 전달되면 removeItem() 메서드는 해당 키가 있는 경우 스토리지에서 해당 키를 제거합니다. 주어진 키와 연결된 항목이 없으면 이 메서드는 아무 작업도 수행하지 않습니다.

localStorage.removeItem('items'); 

분명한()

이 메서드는 호출될 때 해당 도메인에 대한 모든 레코드의 전체 저장소를 지웁니다. 어떤 매개변수도 받지 않습니다.

localStorage.clear(); 

제한 사항

중요한 사용자 정보를 localStorage에 저장하지 마십시오.

정보가 브라우저에만 저장되므로 서버 기반 데이터베이스를 대체할 수 없습니다.

localStorage는 모든 주요 브라우저에서 5MB로 제한됩니다.

localStorage는 데이터 보호 형식이 없고 웹 페이지의 모든 코드에서 액세스할 수 있으므로 상당히 안전하지 않습니다.

localStorage는 동기식입니다. 즉, 호출된 각 작업이 차례로 실행됩니다.

원래 => https://rahulism.tech/article/complete-guide-to-local-storage/

😀읽어주셔서 감사합니다 | 즐거운 코딩하세요😎