Local & Session Storage

set storage item

- localStorage.setItem('<key string>', '<value string>');

- sessionStorage.setItem('<key string>', '<value string>');

get from storage

- const itemName = localStorage.getItem('<key string>');

- const itemName = sessionStorage.getItem('<key string>');

remove from storage

- localStorage.removeItem('<key string>');

- sessionStorage.removeItem('<key string>');

clear storage

- localStorage.clear();

- sessionStorage.clear();

 

★예제

document.querySelector('form').addEventListener('submit',
function(e) {
  const task = document.getElementById('task').value;

  let tasks;

  if(localStorage.getItem('tasks') === null) { 
    tasks = [];
  } else {
    tasks = JSON.parse(localStorage.getItem('tasks'));
  }

  tasks.push(task);

  localStorage.setItem('tasks', JSON.stringify(tasks));

  alert('Task saved');

  e.preventDefault();
})

const tasks = JSON.parse(localStorage.getItem('tasks'));

tasks.forEach(function(task) {
  console.log(task);
});

- local & session storage 에서 value 값에는 string 값만 허용이 된다.

- 그래서 JSON.stringify()를 통해서 JSON형태 이거나 배열형태를 string으로 바꿔서 저장한다.

- 그리고 값을 가져올 때도 string으로 오기 때문에 다시 JSON형태나 배열형태로 바꾸기 위해 JSON.parse()를 사용한다.