Javascript 如何更有效地组织代码，以防止出现不希望出现的行为？

到目前为止，我已经为计时器编写了一个脚本，可以倒计时到特定的一天。问题在于，刷新浏览器的那一刻，它需要1秒的时间才能显示，而不是立即显示

事实上，我确实找到了一种方法让它立即出现，但我不得不用

倒计时日期、现在、时差、一天、天、小时、分钟、秒和
document.getElementById（“计时器”）.innerHTML=直接放在
定时器（）的顶部，这是完全没有效率的

在我下面的尝试中，在刷新浏览器时，倒计时大约出现一秒钟，但我希望它立即出现。我的目标是创建可重用代码

我做错了什么？我该如何修复它

以下是html：

<h1 id="timer"></h1>



以下是js：

function conversion() {
    var countDownDate = new Date("June 1, 2019 24:00:00");

    var now = new Date().getTime(); 
    var timeDifference = countDownDate - now; 
    var oneDay         = 1000 * 60 * 60 * 24; 

    var days = Math.floor(timeDifference / (oneDay));
    var hours = Math.floor((timeDifference % (oneDay)) / (1000 * 60 * 60));
    var minutes = Math.floor((timeDifference % (1000 * 60 * 60)) / (1000 * 60));
    var seconds = Math.floor((timeDifference % (1000 * 60)) / 1000);

    document.getElementById("timer").innerHTML = days + "d " + hours + "h " + minutes + "m " + seconds + "s ";
}

function timerCountdown() {
    var timer = setInterval(function() {
        conversion();
        if(timeDifference < 0) { 
            clearInterval(timer); 
            document.getElementById("timer").innerHTML = "Timer's over."; 
        } 

    }, 1000); 
}

timerCountdown();

函数转换（）{
var倒计时日期=新日期（“2019年6月1日24:00:00”）；
var now=new Date（）.getTime（）；
var时差=倒计时日期-现在；
var一天=1000*60*60*24；
变量天数=数学下限（时差/（一天））；
var小时=数学楼层（（时差%（一天））/（1000*60*60））；
var分钟=数学楼层（（时差%（1000*60*60））/（1000*60））；
var秒=数学地板（（时差%（1000*60））/1000）；
document.getElementById（“timer”）.innerHTML=days+“d”+hours+“h”+minutes+“m”+seconds+“s”；
}
函数timerCountdown（）{
var timer=setInterval（函数（）{
转换（）；
如果（时差<0）{
清除间隔（计时器）；
document.getElementById（“计时器”）.innerHTML=“计时器结束了。”；
} 
}, 1000); 
}
timerCountdown（）；
立即调用
conversion（）
。
将
setInterval
回调放入一个变量中，两个函数都使用该函数调用
setInterval
，并在pageload时立即调用它：

function timerCountdown() {
  var timer = setInterval(intervalCb, 1000); 
  function intervalCb() {
    conversion();
    if(timeDifference < 0) { 
      clearInterval(timer); 
      document.getElementById("timer").innerHTML = "Timer's over."; 
    }
  }
  intervalCb();
}
timerCountdown();

函数timerCountdown（）{
var定时器=设置间隔（间隔CB，1000）；
函数间隔cb（）{
转换（）；
如果（时差<0）{
清除间隔（计时器）；
document.getElementById（“计时器”）.innerHTML=“计时器结束了。”；
}
}
间隔b（）；
}
timerCountdown（）；
嘿，这个答案很有道理谢谢你，我终于明白了。但有一件事我试过了，这引起了一个问题。我删除了
var timer=
，只剩下
setInterval（intervalCb，1000），我把
if（timeDifference<0）{…}
放在
conversion（）
里面，程序运行得很好。原因是什么？似乎是奇怪的行为，因为
timer
在
clearInterval（timer）中
不在
conversion（）
的作用域内。这没有意义，您是否在期望清除间隔的情况下对其进行了测试？如果在作用域中没有持久的
计时器
变量，
clearInterval（timer）
将抛出一个
ReferenceError
。您可以在
timerCountdown
内部定义
转换
，就像
intervalCb
也在
timerCountdown
内部定义一样，这样的
timeDifference
在
timerCoutndown
和
conversion
的范围内，而不是全局。是的，我注意到我也可以这样做。我还想出了一些其他的方法。再次感谢：D。