Таймер без setInterval и setTimeout

Среда разработки использует движок JavaScript, но не поддерживает setInterval и setTimeout. Как сделать таймер используя счетчик Tickcount() - количество тиков сервера (в зависимости от выбранных настроек 50 или 100 тиков в секунду, каждый тик соответственно с интервалом 20 или 10 мс)?


Ответы (2 шт):

Автор решения: Трипольский Пётр

Если вы работаете с библиотекой Qt5, для QJSValue вам потребуется создать setTimeout и setInterval самостоятельно. Дело в том, что метод call у QJSValue позволяет исполнить код в синхронном виде, внутренняя реализация не содержит event loop. Думаю, интерфейс QJSValue будет типовым для любой реализации JS движка...

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


class TimerGlobalObjectExtension : public QObject {
  Q_OBJECT
  public:
    explicit TimerGlobalObjectExtension(QObject* parent = nullptr);
    virtual ~TimerGlobalObjectExtension();
  public slots:
    QJSValue setTimeout(QJSValue handler, QJSValue timeout);
    QJSValue clearTimeout(QJSValue timeout);
};

...

TimerGlobalObjectExtension* extension = new TimerGlobalObjectExtension();
QJSEngine *eval = new QJSEngine();
QJSValue managed = eval->newQObject(extension);
eval->globalObject().setProperty("setTimeout", managed.property("setTimeout"));
eval->globalObject().setProperty("clearTimeout", managed.property("clearTimeout"));
→ Ссылка
Автор решения: Михаил Камахин

А зачем JS? Может на CSS это сделать? (не открывайте не в хроме)

@property --milliseconds {
  inherits: false;
  initial-value: 0;
  syntax: '<integer>';
}

body {
  margin: 0;
  min-height: 100vh;
  display: grid;
  place-items: center;
  background: hsl(10, 10%, 10%);
}

.counter {
  position: relative;
  counter-reset: ms var(--milliseconds);
  animation: count 10s steps(100) infinite;
}

.counter:after {
  content: counter(ms);
  position: absolute;
  top: 0;
  left: 0;
  font-size: 5rem;
  transform: translate(-50%, -50%);
  color: hsl(0, 0%, 100%);
  font-weight: bold;
  font-family: sans-serif;
}

@keyframes count {
  to {
    --milliseconds: 100;
  }
}
<div class="counter"></div>

→ Ссылка