JavaScript, setTimeout

Question

Код:

var first = 0;
var second = 0;
var sub = 0;
function subtractionFunction() {
 document.getElementById('example').innerHTML = "";
 document.getElementById('timerSubtraction').innerHTML = "";
 first = Math.floor(Math.random() * 5);
 second = Math.floor(Math.random() * 5);
 sub = parseInt(first-second);
 document.getElementById('example').innerHTML += first;
 document.getElementById('example').innerHTML += " ";
 document.getElementById('example').innerHTML += '-';
 document.getElementById('example').innerHTML += " ";
 document.getElementById('example').innerHTML += second;
 document.getElementById('timerSubtraction').innerHTML = first + Math.floor(Math.random() * 8);
}
function timerSubtraction() {
 var obj = document.getElementById('timerSubtraction');
 obj.innerHTML--;
 if (obj.innerHTML < sub) {
 return subtractionFunction();
 } else {
 setTimeout(timerSubtraction, 1000);
 }
}

<div onclick="subtractionFunction(); timerSubtraction()"> Click </div>
<div id="example"></div>
<div id="timerSubtraction"></div>

И проблема вот здесь:

if (obj.innerHTML < sub) {return subtractionFunction();} 

Как снова вызвать эти две функции при таком раскладе. Пробовала вызвать subtractionFunction, вызывая в ней при этом timerSubtraction, но не выходит, потому что число уменьшается с шагом в . Как это исправить?

• Skywave: Вам надо timerSubtraction() вызывать каждую секунду?
• Bipa: @Skywave да. Уменьшение числа каждую секунду.
• Skywave: можно вынести setTimeout из timerSubtraction и объявить setInterval вне
• Bipa: @Skywave, простите, но в setTimeout и setInterval я не очень сильно разбираюсь, но точно знаю, что это две разные функции, так ведь? Разве здесь не подходит только setTimeout?
• Vladimir Novopashin: они разные только тем, что setTimeout() выполняет функцию один раз через указанное кол-во времени, а setInterval() выполняет функцию каждые N мс.

Answer 1

В этом примере можно просто вызывать функцию, отвечающую за таймер, внутри subtractionFunction();

var first = 0;
var second = 0;
var sub = 0;
function subtractionFunction() {
 document.getElementById('example').innerHTML = "";
 document.getElementById('timerSubtraction').innerHTML = "";
 first = Math.floor(Math.random() * 5);
 second = Math.floor(Math.random() * 5);
 sub = parseInt(first - second);
 document.getElementById('example').innerHTML += first;
 document.getElementById('example').innerHTML += " ";
 document.getElementById('example').innerHTML += '-';
 document.getElementById('example').innerHTML += " ";
 document.getElementById('example').innerHTML += second;
 document.getElementById('timerSubtraction').innerHTML = first + Math.floor(Math.random() * 8);
 timerSubtraction();
}
function timerSubtraction() {
 var obj = document.getElementById('timerSubtraction');
 obj.innerHTML--;
 if (obj.innerHTML < sub) {
 return subtractionFunction();
 } else {
 setTimeout(timerSubtraction, 1000);
 }
}

А в диве вызывать только одну функцию:

<div onclick="subtractionFunction(); timerSubtraction()"> Click </div>
<div id="example"></div>
<div id="timerSubtraction"></div>

Вот ссылка на https://jsfiddle.net/1vayrdyg/

Сам пример немного странный, но с его помощью, надеюсь, удалось объяснить что нужно сделать.

• Bipa: спасибо за ответ, он, в общем-то, подходит, но есть одна проблема: при верном ответе таймер ускоряется. Наглядно это можно увидеть здесь: kurusa.zhecky.net/lesson_11.