Local Storage & Session

Local Storage

key value pair 이며 String으로만 저장 가능하다. 따라서 배열이나 객체 등은 JSON.stringify 메서드를 이용해 문자열로 변경후 저장한다. 데이터를 삭제하려면 수동으로 지워야 한다. (세션이 종료되어도 데이터가 남아있음)

 

Session Storage

Local Storage와 비슷하나 다른점은 세션이 종료될 때 데이터가 없어진다는 점이다. 

 

// set local storage item
// localStorage.setItem("name", "John");
// localStorage.setItem("age", "30");

// set session storage item
// sessionStorage.setItem("name", "Beth");

// remove from storage
// localStorage.removeItem("name");

// get from storage
// const name = localStorage.getItem("name");
// const age = localStorage.getItem("age");

// // clear local storage
// localStorage.clear();

// console.log(name, age);

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);
});