@thirteen_bit

Как заставить объекты взаимодействовать друг с другом?

Пишу небольшой решение для редактирования отступов у html-элементов методом drag'n'drop. Попытался сформулировать вопрос в виде задачи. На странице есть некая область редактирования EditArea, внутри неё есть объекты Edge, ширину которых можно изменять объектами Control. При взаимодействии с объектом Control меняется его позиция, также нужно изменить ширину у соответствующей Edge и передать информацию об изменении в EditArea. Я не силен в ООП, ниже добавил классы и описал их отношения через композицию. Прошу подсказать, какой шаблон проектирования подойдет лучше всего к моей задаче. Надеюсь, написал не слишком запутанно, любая подсказка по задаче будет очень ценной, спасибо!

class EditArea {
	#edges = [];
	constructor() {
		this.#edges.push(new Edge());
	}
	sendMessage(edge, width) {
		console.log('Изменена ширина грани: ' + width);
	}
}

class Edge {
	#width;
	#control;
	constructor() {
		this.#control = new Control();
	}
	changeWidth(value) {
		this.#width += value;
	}
}

class Control {
	#position = 0;
	/* обработчик события, срабатываемого при взаимодействии с объектом Control */
	onmove() {
		this.#position += 10;
		// здесь нужно заставить сработать changeWidth у Edge
		// и sendMessage у EditArea
	}
}

let editor = new EditArea();
  • Вопрос задан
  • 75 просмотров
Пригласить эксперта
Ответы на вопрос 1
SilenceOfWinter
@SilenceOfWinter
та еще зажигалка...
обернуть объекты в прокси или регистрировать обработчики событий


class Control {
  #position = 0;
  on(eventName, listener) {
     if (typeof this['on' + eventName] !== 'function') {
         throw new Error('Event "' + eventName + '" not exists');
     }
     this.addEventListener(eventName, listener);
  }
  fire(eventName) {
       let event = new CustomEvent(eventName, {detail: this});
       return this.dispatchEvent(event);
  }
  onmove() {
    this.#position += 10;
    return this.fire('move'));
  }
}
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
Artezio Нижний Новгород
от 130 000 до 180 000 ₽
Artezio Москва
от 160 000 до 220 000 ₽
от 80 000 до 120 000 ₽
28 февр. 2021, в 01:35
200000 руб./за проект
28 февр. 2021, в 00:22
2500 руб./за проект
27 февр. 2021, в 22:14
30000 руб./за проект