jak zrobic odliczanie w javascript

Question

Witam, jak zrobić w CZYSTYM jsie odliczanie od 0 do 100 a gdy juz osiagnie 100 spadac do 0 i tak w nieskończoność? Probowałem z while,for i setinterval i nic nie przychodzi mi konkretnego do głowy jak można to dobrze i opytmalnie rozwiązać.

https://codepen.io/FoxCode/pen/WXzEKX

Answer 1

To ja jeszcze troszkę inaczej...

const count = document.querySelector(".count");

  var i = 0;
  var inc = 1;

setInterval(function(){ 
  
    count.innerHTML = i;
    i = i + inc;
  
    if(i === 100 || i === 0){
      inc = inc * -1;
    }
}, 100);

 

Answer 2

Pętle w JS działają trochę inaczej niż w C++. Gdy wykonujesz jakąś funkcje lub pętle w JS dopiero po skończeniu jej działania renderuje się wygląd i pokazuje się określona liczba dlatego musisz użyć setinterval. Jedyne czego ci brakuje to wracania.

Zrobił bym to tak :

dodał zmienną "odwrotność" w zależności od jej wartości dodawał lub odejmował od i wartosć 1. Potem jeszcze bym zmieniał wartość tej zmiennej jeśli bedziemy mieli niej niż 0 i zmienna była na odejmowanie ustawione ustaw dodawanie w przeciwnym wypadku sprawdz czy jest większa od 100 i miała dodawanie jeśli tak ustaw odejmowanie.

Comments

"dodał zmienną "odwrotność" w zależności od jej wartości dodawał lub odejmował od i wartosć 1. Potem jeszcze bym zmieniał wartość tej zmiennej jeśli bedziemy mieli niej niż 0 i zmienna była na odejmowanie ustawione ustaw dodawanie w przeciwnym wypadku sprawdz czy jest większa od 100 i miała dodawanie jeśli tak ustaw odejmowanie."
Trochę to pogmatwane, mógłbyś napisać to w formie jakiegoś kodu? Albo tylko w podobnym jezyku (nie musi dzialac)

Answer 3

Inne śmieszne rozwiązanie:
 

const fn = x => 100 - Math.abs(x - 100)

const go = (n = 0) => {
  const res = fn(n)
  // zakomentuj naastępną linię by nie zapętlać:
  n = res ? n : 0
  
  console.log(res)
  
  if (res || !n) {
    setTimeout(go, 100, ++n)
  }
}

go()

 

Answer 4

moze takie cos? https://codepen.io/JacekRojek/pen/BmrrLE

const count = document.querySelector(".count");

let sign = 1
setInterval(function(){
  const oldValue = count.innerHTML
  const newValue = parseInt(oldValue) + 1 * sign;
  if(newValue > 100) {
    sign = -1
  } else if (newValue < 0){
    sign = 1
  }
  count.innerHTML = parseInt(oldValue) + 1 * sign
}, 100);

albo tak: 

const count = document.querySelector(".count");

loop = () => {
  let x = 0
  const interval = setInterval(() => {
    x++
    const newValue = 100 - Math.abs(x - 100)
    count.innerHTML = newValue
    if (newValue <= 0) {
      clearInterval(interval)
      loop()
    }
  }, 100);
}

loop()