setInterval ускоряется [дубликат]

У вас несколько ошибок:

когда нажимаю на кнопку несколько раз, выполняет за 1 секунду по несколько раз.

Потому что каждый раз при клике создаете новый интервал

clearInterval(click)

Функция clearInterval принимает id интервала, а не функцию + вызывая сразу после создания интервала, у вас бы он ни разу не вызвался, так как сразу бы удалился

function click(){
    console.log('hi');
}
$('.button').on('click', function() {
    // this ссылается на текущий элемент
    if (this.clicked) {
        this.clicked = false;
        clearInterval(this.clickInterval);
    } else {
        // Сохраним флаг и интервал в св-ва конкретной кнопки
        this.clicked = true;
        this.clickInterval = setInterval(click, 1000);
    }
});

Либо, если нужно просто один раз вызвать обработчик, то используйте one

$('.button').one('click', function () {}); // вызовется только один раз

clearInterval(click) — это по сути то же самое, что и

clearInterval(function (){
  console.log('hi');
})

clearInterval должен получить в качестве аргумента не функцию,
а результат вызова функции setInterval. А что же он возвращает?

let interval = setInterval( function(){ 
  console.log( interval ); 
}, 1000 ); 
 
let bubu = setInterval( function(){ 
  console.log( bubu ); 
}, 1000 );

Сам не знал, а оказывается это просто число) Все запущенные интервалы где-то сохраняются под номером, а setInterval возвращает этот номер. clearInterval может взять номер и удалить то, что под ним сохранено.

let interval; 
 
$('.button').on('click', function() { 
  clearInterval( interval ); // Удалить ПЕРЕД запуском нового интервала. 
  interval = setInterval(hi, 1000); 
  // Если очистить интервал тут, сразу после запуска - он просто не сработает. 
}); 
 
function hi() { 
  console.log('hi'); 
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 
 
<button class="button">button</button>