javascript - 当遇到句点或逗号时，如何减慢从数组中输入随机字符串的函数？

Question

我有一个打字机功能:

var myArray = [
  'sentence. another sentence.', 
  'this sentence. yet another sentence.', 
];
var rand = myArray[Math.floor(Math.random() * myArray.length)];
var i = 0;
var speed = 55;

function typeWriter() {
  if (i < rand.length) {
    document.getElementById("question").innerHTML += rand.charAt(i);
    i++;
    setTimeout(typeWriter, speed);
  }
}

typeWriter();

<div id="question"></div>

如果当前正在输入的字符是句点或逗号，如何将打字机功能速度更改为 80 毫秒，然后在输入普通字母时返回到 55 毫秒？这将帮助我通过打字功能模仿语音节奏并提高可读性。感谢您的帮助。

Answer 1

只需将 speed 或第二个参数更改为 setTimeout。

当您这样做时，您也可以通过以下方式使代码更清晰:

1) 使用await而不是setTimeout，

2) 为延迟命名(例如 DELAYS)，而不是一堆内联常量

3) 使用适当的 for 循环，而不是使用 if 语句重新发明 for 循环

4)使用适当的局部变量和函数参数而不是全局变量。

5) 使用 Element.textContent 而不是 innerHTML

6) 除非必要，否则请在 JS 中使用单引号。

let el = document.querySelector('div');

let wait = delay => new Promise(r => setTimeout(r, delay));

let typeWriter = async sentence => {
  const DELAYS = {'.': 500, ',': 200, default: 55};

  for (let c of sentence) {
    el.textContent += c;
    await wait(DELAYS[c] || DELAYS.default);
  }
};

typeWriter('sentence. a comma, another sentence. this sentence. yet another sentence.');

<div></div>