Создание счетчика min: sec с помощью javascript

Question

Я пытаюсь сделать небольшую игру с вопросом/ответом, используя реакцию, и я хочу показать таймер, который отсчитывает каждую секунду. Каждая игра длится 10, 15 или 30 минут максимум, поэтому я хочу показать таймер, который обновляется каждую секунду в нижней части экрана (в большом шрифте, конечно!), Что-то вроде 15:00, 14:59, 14:58 и так и до тех пор, пока он не достигнет 00:00.

Итак, учитывая время начала, такое как 2016-04-25T08:00:00Z, и время окончания после добавления 15 минут 2016-04-25T08:15:00Z, я хочу начать обратный отсчет.

Моя проблема в том, что я не понимаю, как использовать setIntervals, чтобы продолжать вызов моего метода, чтобы найти оставшееся время.

timeLeft = Math.round(timeLeft/1000) * 1000; 
const timer = new Date(timeLeft); 
return timer.getUTCMinutes() + ':' + timer.getUTCSeconds(); 

Answer 1

EDIT: Вы отредактировали свой вопрос. Вам потребуется время отступы и метод ниже будет быстрее, чем то, что вы используете, но ответить на ваш вопрос о setInterval:

Во-первых, определить вашу функцию, чтобы запустить таймер и декремента каждый раз, когда это называется:

var timeLeft; // this is the time left 
var elem; // DOM element where your timer text goes 
var interval = null; // the interval pointer will be stored in this variable 

function tick() { 
    timeLeft = Math.round(timeLeft/1000) * 1000; 
    const timer = new Date(timeLeft); 
    var time = timer.getUTCMinutes() + ':' + timer.getUTCSeconds(); 
    elem.innerHTML = time; 

    timeLeft -= 1000; // decrement one second 

    if (timeLeft < 0) { 
    clearInterval(interval); 
    } 
} 

interval = setInterval(tick, 1000); 

OG Ответ:

нет, я не верю, что есть встроенный способ отображения различий во времени.

Допустим, у вас есть две даты объекты:

var start = Date.now(); 
var end = Date.now() + 15 * 60 * 1000; // 15 minutes 

Тогда вы можете вычесть два Date объекты, чтобы получить число миллисекунд между ними:

var diff = (end - start)/1000; // difference in seconds 

Чтобы получить количество минут, вы берете diff и разделить его на 60 и пол, которые являются результатом:

var minutes = Math.floor(diff/60); 

Для того, чтобы получить количество секунд, вы берете модуль, чтобы получить остаток после минуты удаляются:

var seconds = diff % 60; 

Но вы хотите, эти два дополненный нулями, так, чтобы сделать это, вам преобразовать в строки и проверьте, они имеют два символа. Если нет, вы добавите ноль:

// assumes num is a whole number 
function pad2Digits(num) { 
    var str = num.toString(); 
    if (str.length === 1) { 
    str = '0' + str; 
    } 
    return str; 
} 

var time = pad2Digits(minutes) + ':' + pad2Digits(seconds); 

Теперь у вас есть время в минутах и ​​секундах.