JSON.parse(), forEach()

JSON은 JavaScript Object Notation의 준말이다. 자바스크립트 객체 표기로 해석해도 될지 모르겠다.

JSON.parse(text)에서 text는 JSON으로 파싱할 문자열에 해당한다.

다시 말하면, datatype이 현재 문자열인 데이터를 객체형 데이터로 바꾸겠다는 뜻으로 보면 좋다.

웹브라우저에서 폼을 통해 입력 받은 값을 문자열로 저장해야 스크린샷처럼 작성한 text와 id 값을 정확히 알 수 있다

localStorage.setItem(TODOS_LS, JSON.stringify(toDos));

JSON.stringify(text)는 text를 문자열로 변환해주는 메소드이다.

그리고 로컬스토리지에 문자열 형태로 저장된 값을 호출하여 웹브라우저 상에서 띄우려면 다시 객체로 파싱해주어야한다. 

const loadedToDos = localStorage.getItem(TODOS_LS);
const parsedToDos = JSON.parse(loadedToDos);

객체로 파싱하여 정의된 변수를 객체(배열) 안에 포함된 요소마다 paintTodo 함수를 적용하기 위해 forEach() 메소드를 사용한다.

parsedToDos.forEach(function(toDo){
    paintToDo(toDo.text);
})