[js] 브라우저에 데이터 저장하는 수단

lilyoh·2020년 7월 23일
0
post-custom-banner

브라우저에 데이터를 저장하는 수단에는 3가지가 있다.

  • local storage : 해당 도메인에 영구 저장하고 싶을 때
  • session storage : 해당 도메인의 한 세션에서만 저장하고 싶을 때. 창을 닫으면 정보가 날라간다.
  • cookie : 해당 도메인에 날짜를 설정하고 그 때까지만 저장하고 싶을 때

셋 다 global 변수로 접근 가능하다.
콘솔 창을 열고

  • 쿠키를 확인하고 싶을 때
document.cookie
  • localStorage -> 특정 값을 보고 싶으면 getItem 메서드로 접근
  • sessionStorage -> 값을 수정하거나 추가하고 싶으면 setItem 메서드로 접근

getCookie 함수를 구현해주세요
1. 아무 인자도 받지 않습니다.
2. 쿠키에 접근해서 저장된 현재 쿠키 정보를 가져옵니다.
3. wecode_cookie 라는 key값으로 저장된 쿠키정보를 추출하고 그 value 값을 리턴합니다.

function getCookie(){
  // test 변수에 쿠키값 저장
  const test = document.cookie;
  // test 변수의 값인 string 을 '; '로 split 해준다
  // 세미콜론 뒤에 공백이 있는 이유는 쿠키값이 저렇게 생겨서이다
  arr1 = test.split('; ');
  // 배열을 하나 생성해주고
  arr2 = [];
  // arr1 배열의 값을 돌면서 '=' 로 한 번 더 split 해준다
  // arr2 배열은 배열 안에 배열이 들어있는 형태가 된다
  for (let i = 0; i < arr1.length; i++) {
    arr2.push(arr1[i].split('='));
  }
  // arr2 배열에서 nested 된 배열의 첫 번째 값이 "wecode_cookie" 인 값의 두 번째 값을 반환한다.
  for (let i = 0; i < arr2.length; i++) {
    if (arr2[i][0] === "wecode_cookie") {
      return arr2[i][1];
    }
  }
}
  • 항상 출력해서 값을 확인하면서 코딩한다.
post-custom-banner

0개의 댓글