콘솔에 찍어보는 초간단 Todo 리스트 프로젝트
<aside> ☝ 목차
</aside>
let todos = [];
기본 로직
function addTodo(content) {
const todo = {
id: todos.length + 1,
content: content,
completed: false,
};
todos.push(todo);
displayTodos();
}
기본 로직
function displayTodos() {
console.log('현재 todos ');
todos.forEach((todo) =>
console.log(`${todo.id}: ${todo.content} - ${todo.completed ? '✅' : '❌'}`)
);
}
displayTodos를 구현 했으니 addTodo를 활용해서 아래 내용을 추가해보면
addTodo('자바스크립트 공부');
addTodo('리액트 공부');
addTodo('HTML/CSS 공부');
콘솔에 출력되는 모습은 아래와 같다
현재 todos 1: 자바스크립트 공부 - ❌ 2: 리액트 공부 - ❌ 3: HTML/CSS 공부 - ❌
기본 로직
function deleteTodo(id) {
todos = todos.filter((todo) => todo.id !== id);
displayTodos();
}