천진난만 코딩 스토리
14. Deleteing To Dos (part 1) 본문
- HTML -
변경사항 없음.
- JS -
console.log(li.id); 를 하여
X버튼을 누르는 li의 id를 console에 기록되게 함.
(이 때 id는 Date.now()인 id임)
li.id = newTodo.id; 를 하여
li.id는 newTodo.id인 작성한 ToDo의 id라고 저장함.
span.innerText = newTodo.text; 를 하여
span의 innerText에 newTodo의 text를 저장하게 함.
(실제로 저장되는 건 newTodoObj.text임)
const newTodoObj = { 를 하여
newTodoObj를 만들고 그 안에 Object를 만듬.
text: newTodo, 를 하여
text에는 newTodo를 저장하고,
id: Date.now(), 를 하여
id에는 Date.now()를 하여
밀리초(1000분의 1초)를 줌.
};
toDos.push(newTodoObj); 를 하여
toDos에 newTodoObj를 넣어줌.
paintToDo(newTodoObj); 를 하여
paintToDo에 string으로newToDo를 주는 것 대신
newTodoObj를 줌.
function paintToDo(newTodo) 의
newTodo는 매개변수(parameter)임.
즉 paintToDo 함수 내에서 사용하기 때문에 마음대로 적어도 상관 없음.
paintToDo(newTodoObj); 의
newTodoObj는 인자(argument)임.
paintToDo라는 함수에 사용되는 실제값임.
그렇기에 paintToDo에 사용되는 실제 값은
newTodo(매개변수)가 아닌 newTodoObj(인자)임.
- 화면 -
todo를 작성하면 각 각 id가 주어지고
삭제를 하면 삭제한 li의 id가 console에 기록됨.
하지만 새로고침하면 삭제한 li가 다시 생김.
'노마드코더 > 바닐라 JS로 크롬 앱 만들기' 카테고리의 다른 글
16. Weather 만들기 (Geolocation) (0) | 2023.01.20 |
---|---|
15. Deleteing To Dos (part 2) (0) | 2023.01.16 |
13. To Do List (Loading To Dos) (0) | 2023.01.15 |
12. To Do List (Saving ToDos) (0) | 2023.01.15 |
11. To Do List (Deleting ToDos) (0) | 2023.01.14 |