[JavaScript] localStorage

<Storage>

: 사용자 로컬에 데이터를 저장하는 저장소

 

• 단순한 key-value 저장소이며, key와 value는 항상 문자열로 저장됨
• 도메인과 브라우저 별로 데이터를 저장
• localStorage와 sessionStorage 두 가지가 있다.

1. localStorage
   • 사용자가 직접 지우지 않는 이상 계속해서 데이터가 유지됨
2. sessionStorage:
   • 동일한 세션에서만 사용 가능 (브라우저를 닫을 경우, 데이터가 제거됨)

따라서, 지속적으로 사용해야 할 데이터는 localStorage에 일회성 데이터는 sessionStorage에 저장

 

다음은 localStorage 사용법이며, sessionStorage도 이와 유사하다.

// 데이터 저장 - (key, value)의 json 형태로 저장된다.
    localStorage.a = '123';
    localStorage.setItem('a', '123');

    var variable = 'a';
    localStorage[variable] = '123';        // 키를 변수를 사용하여 저장

    var test_json = {'num1': num1, 'num2': num2, 'num3': num3};
    localStorage.a = JSON.stringify(test_json);        // json 객체를 value로 저장하고 싶을 때


// 데이터 불러오기
    localStorage.a;
    localStorage.getItem('a');

    var q = JSON.parse(localStorage.getItem(test_json));    // 저장한 json 객체를 불러올 때


// 데이터 삭제
    localStorage.removeItem('a');    // 원하는 값만 삭제
    localStorage.clear();    // 저장된 모든 값을 삭제