Javascript setInterval和setTimeout之间的冲突

出于教育目的，我用JavaScript编写了以下代码。目标是模拟电传打字机，在内容写入后，机器会在再次启动前暂停

var str = 'Some text';
strArray = str.split("");
window.onload = function teleType() {
  var ctrl = 0;
  var wrapId = document.getElementById("wrap");
  var type = setInterval(function() {
    wrapId.innerHTML += strArray[ctrl];
    if (ctrl == strArray.length) {
      wrapId.innerHTML = "";
      ctrl = 0;
      clearInterval(type);
    }
    ctrl++;
  }, 2000);
  setTimeout(teleType, 3000);
}

---

但是随着这些间隔（mlliseconds），机器开始有一种奇怪的行为。它跳转字母（索引）或从开头开始，但不到达字符串（数组）的结尾。

setInterval

和

setTimeout

之间发生了什么

调用

setInterval

后，立即调用

setTimeout

。
因此，您将在间隔完成之前触发

电传打字机

您可以在间隔结束时移动

setTimeout

：

var str='Some text'；
strArray=str.split（“”）；
window.onload=功能电传打字机（）{
var-ctrl=0；
var wrapId=document.getElementById（“wrap”）；
var type=setInterval（函数（）{
wrapId.innerHTML+=strArray[ctrl]；
如果（ctrl==strArray.length）{
wrapId.innerHTML=“”；
ctrl=0；
净间隔（类型）；
设置超时（电传打字机，300）；
}
ctrl++；
}, 200);
}

---

将文本输出到控制台的示例函数

function showTeleText(text, repeat) {
    var textByChar = text.split(''),
        intermText = '',
        textPos = 0;

    var interval = setInterval(function () {
        intermText += textByChar[textPos++]
        console.log(intermText);

        if (textPos >= textByChar.length) {
            clearInterval(interval);

            if (repeat) {
                setTimeout(function () {
                    showTeleText(text, repeat);
                }, 2000);
            }
        }
    }, 500);
}

在

window.load上加载
call
showTeleText（'Some text！'，true/false）
like

window.load = function() {
    showTeleText('Some text!', true); 
}

你读过
setInterval
和
setTimeout
如何用于教育目的吗？@smnbbrv我的想法是，在这个例子中，
setTimeout
只有在
setInterval
完成后才会运行。谢谢。我认为
setTimeout
只能在
setInterval
完成后运行。对于completed，我的意思是在
if
中清除时。