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

Question

[Игорь]

Мы цепляем див и задаем ему высоту и шерену через свойства объекта

heroObj={
   	widt: 150,
   	heigh:100
   };
// ШИРИНА ГЕРОЯ  
heroWid= document.getElementById("hero").style.cssText='width:'+heroObj.widt+'px; height: '+ heroObj.heigh+ 'px;';

 heroObj.heigh=200;

Мы создали объект и ширина,высота дива берется из свойств объекта,но когда ниже мы перезаписываем свойство объекта ширину то див не изменяется.

Ниже в коде будут постоянно идти корректировки так как будет игра и все свойства будут динамичны.

Как это реализовать?

Через setInterval?

Конечно же надо реализовывать с минимальной нагрузкой на CPU

Comments

[Markus Kelvin]

а в чем суть вопроса или проблемы?

[Игорь]

Markus Kelvin:
heroObj.heigh=200; мы изменили свойство объекта но высота дива не изменилась,нужно чтобы по мере изменения свойст обхекта именялиь и иего физические параметры

Answer 1

[Алексей П]

шаблон проектирования pub/sub или mediator

Comments

[Игорь]

что?

[Алексей П]

https://habrahabr.ru/post/229589/

[Игорь]

Алексей П: как это поможет мне?

[Алексей П]

Игорь Николаевич: охх..
.largescalejs.ru/the-mediator-pattern
подпишите свой объект на изменение каждого параметра, а отрисовку дива запихните в функцию. когда будет происходить изменение, инкапсулируйте данные в событие, по этому событию вызывайе отрисовку дива. в функции отрисовки вытаскивайте переданные данные.

[Игорь]

Алексей П:https://jsfiddle.net/t9yeuw4g/

я сделал так,а Вы как имели ввиду?

[Алексей П]

Игорь Николаевич: вот так

[Игорь]

Алексей П: в скайпе добавил тебя.
и вопрос почему юзаешь querySelector ,если можно просто .all("hero") ?