Javascript setInterval每次运行时都会变短

Question

所以我已经制作了一个逐字打印文本的功能,如下所示.(我知道我的命名方案不是很好,请不要取笑.还要记住我还是很新编码所以我的代码可能看起来有点奇怪/低效.)

var text = document.getElementById("gametext")
var dialog =  "the entire text you want to print out"
var talk = "The whole text gets added here, letter by letter"
var charinc = 0

function talky() {
   setInterval(function(){
   if(charinc < dialog.length){
   talk = dialog.charAt(charinc++);
   text.innerHTML += talk;  
   }
   }, 100);
   charinc = 0
}

我在整个代码中多次调用此函数,将对话框设置为我要打印的任何内容,然后调用该函数.这一切都很好,但每次我运行它,似乎字母打印得越来越快.我不确定发生了什么,或者如何解决它.我在谷歌上做了一些搜索,但没有任何有用的信息.

Answer 1

第一次运行它时,每100ms运行一个间隔.

第二次运行它时,有两个间隔,每个间隔每100ms运行一次.

等等.

由于它们共享相同的变量,因此您只需使每个变量以每100ms一次写入的速度提高输出速度.

或者:

• clearInterval(...)完成后打电话
• 将全局变量作为参数传递给talky它们,以便它们不在多个间隔之间共享
• 只需更新变量而不是talky再次调用