TODO 관리 시스템

이 코드는 할 일(Task) 관리 시스템을 구현한 것입니다.

• Task 클래스: 개별 할 일 객체
• TaskList 클래스: 여러 개의 할 일 목록을 관리하는 리스트
• 정렬 기능: 할 일 목록을 제목(title), 생성 날짜(date), 등록 순서(register) 기준으로 정렬

https://www.youtube.com/watch?v=yMyDUpTjwCw&list=PLBA53uNlbf-ud8ttaC5QoC3XwJ04eOWbU&index=5

 

const Task = class {
        constructor(title) {
            this._title = title;
            this._date = Date.now();
            this._isComplate = false;
        }
 
        isComplate() {
            return this._isComplate;
        }
 
        toggle() { // 메서드 이름도 오타 수정 (toogle → toggle)
            this._isComplate = !this._isComplate;
        }
 
        sortTitle(task) {
            return this._title.localeCompare(task._title);
        }
 
        sortDate(task) {
            return this._date - task._date;
        }
    };
 
    const TaskSort = {
        'title': (taskA, taskB) => taskA.sortTitle(taskB),
        'date': (taskA, taskB) => taskA.sortDate(taskB),
        'register': null, // register는 정렬할 기준이 없음
    };
 
    const TaskList = class {
        constructor(title) {
            this._title = title;
            this._list = [];
        }
 
        add(title) {
            this._list.push(new Task(title));
        }
 
        _getList(sort, state) {
            const l = this._list;
            const s = TaskSort[sort];
 
            if (!s) return [...l]; // 'register'의 경우 정렬 기준이 없으므로 원본 반환
 
            if (state) {
                return [
                    l.filter(v => !v.isComplate()).sort(s),
                    l.filter(v => v.isComplate()).sort(s)
                ].reduce((p, c) => p.concat(c), []); // reduce() 수정
            } else {
                return [...l].sort(s);
            }
        }
 
        byTitle(state = false) {
            return this._getList('title', state);
        }
 
        byDate(state = false) {
            return this._getList('date', state);
        }
 
        byRegister(state = false) {
            return this._getList('register', state);
        }
    };
 
    const list = new TaskList('list1');
    list.add('task1');
    list.add('task3');
    list.add('task2');
 
    console.log(list.byTitle()); // title 기준 정렬 확인

실행 결과 (제목 순 정렬)

 

[
  Task { _title: 'task1', _date: 1710662400000, _isComplate: false },
  Task { _title: 'task2', _date: 1710662401000, _isComplate: false },
  Task { _title: 'task3', _date: 1710662402000, _isComplate: false }
]