У вас методы и переменные относящиеся к списку дел являются глобальными, что неожиданно сильно всё усложнит, если вдруг вы захотите, чтобы у вас был ещё один список.
Например, абстрактный тип данных «список дел» может быть оформлен в виде класса, и тогда все списки дел в программе будут являться объектами — экземплярами класса «список дел».
Вызвав new ToDoApp вы получаете ссылку на объект, в котором всё относится к одному определённому списку дел.
<body><script>
//описание класса «список дел»
class ToDoApp {
constructor(todos) {
this.todos = todos;
//здесь возможно создать нужные элементы
this.element = document.createElement("div");
this.element.classList.add("todo");
this.activeInput = null; // и т. д.
this.render();
// добавление событии
this.element.addEventListener("keypress", this.rowEvent.bind(this));
this.element.addEventListener("click", this.rowEvent.bind(this));
// добавление в DOM приложения
document.body.appendChild(this.element);
}
count() {}
findById() {}
rowEvent() {}
closeActiveInput() {}
createRow() {}
add() {}
remove() {}
edit() {}
render() {
// для примера вывод текста задач, здесь всё очень приблизительно для примера,
// но вы можете заполнить своим кодом из примера выше
this.element.textContent = this.todos.map(task => task.text).join(", ");
}
}
// пример использования
var todoApp = new ToDoApp([
{id: 1, status: false, text: 'Herb'},
{id: 2, status: false, text: 'Tea'},
]);
var todoApp2 = new ToDoApp([
{id: 1, status: false, text: 'CSS'},
{id: 2, status: false, text: 'HTML'},
]);
</script>
|
Сообщение от villiwalla
|
|
Каким образом можно организовать подписку слушателей события на всех элементах управления, более кучно?
|
Это может быть сделано при создании нового экземпляра класса ToDoApp, когда вызывается функция
constructor.
|
Сообщение от 9-ое издание спецификации ECMAScript, пункт 4.2.1
|
|
[...] часто бывает удобно определить абстракции похожие на класс [...] Встроенные объекты ECMAScript сами следуют такому шаблону. Начиная с ECMAScript 2015, язык ECMAScript включает определение синтаксиса классов, которое позволяет программистам кратко определять объекты, которые соответствуют тому же шаблону абстракции похожей на класс, который используется встроенными объектами.
|