📚 [ JavaScript 복습 : Date / Web Storage / JSON ]

---

🕓 [ Date 객체 ]

함수	설명
new Date()	현재 시스템(PC)의 날짜 및 시간을 갖는 객체 반환
getFullYear()	현재 연도 반환
getMonth()	현재 월 반환 (0부터 시작하므로 +1 필요)
getDay()	현재 요일 반환 (일요일=0 ~ 토요일=6)
getDate()	현재 일 반환

let now = new Date();
console.log(now.getFullYear()); // 연도
console.log(now.getMonth() + 1); // 월
console.log(now.getDate()); // 일

---

💾 [ 웹스토리지 (Web Storage) ]

웹 브라우저에서 데이터를 로컬에 저장할 수 있는 저장소

구분	특징	지속시간	주요 사용 예시
🧠 Session Storage	브라우저 종료 시 삭제	일시적	로그인 세션, 임시 입력값
💽 Local Storage	사용자가 직접 삭제 전까지 유지	영구적	자동 로그인, 팝업(다시보지 않기)

⚙️ 사용법 (Session / Local 동일)

코드	설명
setItem('속성명', 속성값)	데이터 저장
getItem('속성명')	데이터 호출
removeItem('속성명')	특정 데이터 삭제
clear()	모든 데이터 삭제

📎 주의사항
1. 속성명은 반드시 문자형(String)
2. 속성값도 반드시 문자형(String)
→ 객체나 배열은 JSON 변환 필요!

---

🧾 [ JSON (JavaScript Object Notation) ]

자바 객체를 문자열로 표현하는 데이터 교환 형식

구분	예시	설명
객체 타입	{ age: 40 }	JS 객체
문자열 타입	"{ age: 40 }"	JSON 문자열

🌍 HTTP 통신은 객체를 전송할 수 없기 때문에 문자열로 변환 필요
→ 한국(객체 → 문자열) → 일본(문자열 → 객체)

🔁 변환 메소드

함수	설명
JSON.stringify(자료)	JS 자료 → 문자열 변환
JSON.parse(자료)	문자열 → JS 객체/배열 변환

---

🔄 [ JSON과 웹스토리지의 결합 ]

전역 변수 대신 LocalStorage / SessionStorage + JSON 조합으로 데이터 관리

🔧 절차

1️⃣ 입력 마크업 객체 가져오기
2️⃣ 입력값 가져오기
3️⃣ 입력값 객체화
4️⃣ WebStorage에서 List 가져오기
5️⃣ 없으면 새 배열 생성, 있으면 JSON.parse()로 변환
6️⃣ 배열에 새 데이터 추가
7️⃣ JSON.stringify()로 문자열 변환 후 저장

let userList = JSON.parse(localStorage.getItem('userList')) || [];
userList.push({ name: '홍길동', age: 25 });
localStorage.setItem('userList', JSON.stringify(userList));

🧠 왜 변환해야 할까?
웹스토리지는 문자열만 저장 가능하므로, 객체나 배열을 저장하려면 반드시 JSON.stringify() 필요!

---