Сравнение нового и старого значения переменной

Есть функция, которая получит значение с помощью метода getapi:

async function change(){
    arrtop = document.querySelector('.arrowtop');
    arrbot = document.querySelector('.arrowbot');
    rect = document.getElementById('rect');
    temp = Math.round(await getapi(api_url)); // Переменная со значением
    switch(temp){}
    if(temp1 < temp2){
        arrtop.style.visibility = 'visible';
        arrbot.style.visibility = 'hidden';
    }else if(temp1 > temp2){
        arrbot.style.visibility = 'visible';
        arrtop.style.visibility = 'hidden';
    }
    setTimeout(change, 5000);
}
change();

Но, важная часть ниже

Идея в том что при первом срабатывании функции, запоминается полученная переменная (temp1), при втором срабатывании получается новое значение из того же источника (temp2) и сравнивается с предыдущим значением (в этом и заключается функция кода ниже), после чего запоминало второе значение (в temp1), получало третье (в temp2) и сравнивало его со вторым, и так в бесконечном цикле.

if(temp1 < temp2){
    arrtop.style.visibility = 'visible';
    arrbot.style.visibility = 'hidden';
}else if(temp1 > temp2){
    arrbot.style.visibility = 'visible';
    arrtop.style.visibility = 'hidden';
}

Проблема в том, что я не знаю как сделать так, чтобы функция запоминала предыдущее значение, ведь по окончании функции значения теряются.


Ответы (2 шт):

Автор решения: ThisMan

Есть несколько вариантов

  • вынести переменную за функцию и менять ее значение ( без создания temp, temp1, temp2 )
let cache = 0;

function change() {
  const result = Math.random();
  console.log(cache - result);

  cache = result;
}


change();
change();
change();
  • сделать переменную св-вом функции
function change() {
  const result = Math.random();
  console.log(change.cache - result);

  change.cache = result;
}

change.cache = 0;


change();
change();
change();


→ Ссылка
Автор решения: Vadim

Выносишь переменную за тело функции, и всё

(async()=>{
    const arrtop = document.querySelector('.arrowtop');
    const arrbot = document.querySelector('.arrowbot');
    const rect = document.getElementById('rect');

    let temp2 = 0;
    while(true){
        const temp1 = Math.round(await getapi(api_url));

        if(temp1 < temp2){
            arrtop.style.visibility = 'visible';
            arrbot.style.visibility = 'hidden';
        }else if(temp1 > temp2){
            arrbot.style.visibility = 'visible';
            arrtop.style.visibility = 'hidden';
        }

        temp2 = temp1;
        await new Promise((z)=>setTimeout(z, 5000));
    }
})();
→ Ссылка