在第一次方法调用时执行所有if- body的正确方法

Right way to execute all if-bodies on the first method call

本文关键字:方法 body if- 第一次 调用 执行      更新时间:2023-09-26

我使用JavaScript在网站上显示二进制时钟。当网站第一次加载时,需要将时钟设置为正确的时间,然后再更新。

获得这种行为的正确方法是什么?现在我有一个在每次更新时检查的var,并在第一次运行后设置为false。

复制这个函数,去掉条件,让它调用另一个函数是不是更好?

功能如下:

time.firstRun = true;
function updateBinaryClock() {
var now = moment().toObject();
var bin;
if (time.showClockWithSeconds) {
    bin = toSixBit(now.seconds.toString(2));
    setColor(".binSec", bin);
}
if (now.seconds == 0 || time.firstRun) {
    bin = toSixBit(now.minutes.toString(2));
    setColor(".binMin", bin);
}
if (now.minutes == 0 || time.firstRun) {
    bin = toSixBit(now.hours.toString(2));
    setColor(".binHour", bin);
}
if (time.firstRun) {
    time.firstRun = false;
}
setTimeout(updateBinaryClock, 0.1 * 1000);
}

您的函数很快就会使内存饱和,因为您忘记在每个函数执行时清除超时。你可以用setInterval来代替setTimeout:

function updateBinaryClock() {
    aux_updateBinaryClock(true);
    setInterval(aux_updateBinaryClock, 100); // 0.1*1000
}
function aux_updateBinaryClock(isFirstRun) {
  var now = moment().toObject(),
      bin;
  if (time.showClockWithSeconds) {
      bin = toSixBit(now.seconds.toString(2));
      setColor(".binSec", bin);
  }
  if (now.seconds === 0 || isFirstRun) {
      bin = toSixBit(now.minutes.toString(2));
      setColor(".binMin", bin);
  }
  if (now.minutes === 0 || isFirstRun) {
      bin = toSixBit(now.hours.toString(2));
      setColor(".binHour", bin);
  }
}
updateBinaryClock();

还要注意setInterval和setTimeout是不准确的,setInterval和setTimeout有许多更准确的实现。This or This)

我要做的是把它分成两个函数。

function initBinaryClock() {
}
function updateBinaryClock() {
  requestAnimationFrame(updateBinaryClock);
}
window.addEventListener("load", function loader(){
  window.removeEventListener("load", loader, false);
  initBinaryClock();
  updateBinaryClock();
}, false);