Кнопка для запуска таймера на JavaScript

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

<button id="start">start</button>

Напишем соответствующий JavaScript:

let start = document.querySelector('#start');

start.addEventListener('click', function() {
	let i = 0;
	
	setInterval(function() {
		console.log(++i);
	}, 1000);
});

Сделайте кнопку, по нажатию на которую в консоль будет выводится обратный отсчет, начиная с 100.

Многократное нажатие на кнопку

Код, приведенный мною выше, на самом деле имеет некоторую проблему. Эта проблема проявляется в том случае, если на нашу кнопку сделать несколько кликов. В этом случае каждый клик будет приводить к запуску нового таймера.

То есть, к примеру, три нажатия на кнопку приведут к тому, что будет запущено три таймера, и каждый из этих таймеров будет выводить значение счетчика в консоль. Это значит, что значения будут меняться в три раза быстрее!

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

let start = document.querySelector('#start');

start.addEventListener('click', function func() {
	let i = 0;
	
	setInterval(function() {
		console.log(++i);
	}, 1000);
	
	this.removeEventListener('click', func); // отвязываем обработчик
});

Возьмите ваше решение предыдущей задачи. Проверьте, что многократное нажатие на кнопку приводит к ускорению отсчета. Исправьте эту проблему.