[바닐라 JS 챌린지] To-do 삭제하기 - Date.now

Input value를 object로 toDos배열에 저장함. item마다 고유 id추가

li를 구분하기 위해 li마다 개별 id를 추가함.

강의 요약

▼ 기존 방식의 문제

어떤 HTML element를 삭제할지는 알고있다 >> event.target.parentElement (btn의 부모인 li를 삭제해주었다.)

그러나 array의 어떤 element를 DB에서 삭제할지는 모른다.

 

만약 toDos 에 'a'라는 값이 2개이상 저장될 경우 어떤 a를 삭제해야될까?

>> 구별할 수 있는 id를 주자!

 

▼ 해결 방법

1) toDos array에 그냥 text를 저장하지 말고, object를 만들어 저장한다.

2) object마다 고유 id를 줘서 구분이 가능하게 만들자.

 

바뀌기 전)

입력받은 input value 값을 그대로 push했었음 >> toDos.push(Input)

 

바뀐 후)

입력받은 input value를 오브젝트로 만들어 push함 >> toDos.push(Obj)

 

 

1. 고유 id를 랜덤하게 주기 위한 함수 - Date.now()

 

2. 헷갈릴까봐 정리

• array에 새로 추가 - array.push(item)
• array에서 삭제 - array.remove()
• localStorage에 추가 - localStorage.setItem(key, val)
• localStorage에서 삭제 - localStorage.removeItem(key)