본문 바로가기
Javascript/Vanilla JS

[바닐라 JS 챌린지] To-do 리스트 저장, 불러오기 - localStorage, stringify

by ginny. 2024. 7. 1.

 

ToDo를 localStorage에 저장하는 saveToDos 함수를 새로 만들었다.

 

ToDo를 paint로 화면에 보여주고, save로 브라우저에 저장
localStorage에 배열 형태로 들어가있음 와우!

 

 

강의 요약

To-Do 리스트를 localStorage에 저장해 새로고침해도 유지되도록 만들었다.

 

1. toDos 배열 - 매번 입력받은 newTodo를 저장(push).

2. array.push(item) - 배열에 새로운 아이템 추가하는 함수 

3. saveToDos - toDos 배열의 값을 localStorage에 저장할 함수

4. localStorage에는 문자열만 저장 가능함. 배열은 문자열로 변환이 필요하다!

5. JSON.stringify - object나 array를 문자열로 변환

6. localStorage.setItem(key,value) - 브라우저에 데이터 저장하기

 

댓글