SetInterval () yardımıyla JavaScript'te basit bir geçiş işlemini nasıl gerçekleştirebilirim?

Bayrak değişkenini işlevin dışına taşıma:

let b = true;

const fnInterval = setInterval(function() {
    if (b) {
        console.log("hi");
    } else {
        console.log("bye");
    }
    b = !b
}, 1000);

Zamanlayıcıyı 10000 milisaniyeden sonra durdurmak için aramayı şu konuma getirin: clearInterval in a setTimeout:

setTimeout(() => clearInterval(fnInterval), 10000);

Bu arada, dönüş değerinin setInterval bu bir işlev değil, bir sayıdır, bu yüzden onu aramak yanıltıcı olabilir fnInterval.

Her şeyden önce, beyan et let b = true geri arama işlevinin dışında. Aksi halde her aramada yeniden başlatılır.

İkincisi, 10000 içinde clearTimeout(fnInterval, 10000) geçerli bir parametre değil. clearTimeout(timeoutId) yalnızca ilk parametreyi kabul eder ve hemen geçirilen zaman aşımını temizler. İhtiyacın olacak setTimeout hedefiniz buysa, bunu 10 saniye sonra tetiklemek için. Ancak bu, iki zaman aşımı arasında bir yarış koşuluna neden olur-yanlışlık, bazı günlükleri kaçıracağınız veya fazladan günlüklerle sonuçlanacağınız anlamına gelebilir.

Bir sayaç kullanmak, diğer cevapların gösterdiği gibi bir çözümdür, ancak genellikle karmaşık zamanlama kullandığımda setInterval bu, birkaç yinelemeden sonra temizlemeyi gerektirir, genel bir söze refactor sleep dayalı fonksiyon setTimeout. Bu, arama kodunu çok daha temiz tutar (geri arama yok) ve bunlarla uğraşmayı önler clearTimeout.

Bayrağı iki ileti arasında ileri geri çevirmek için bir boole yerine, daha iyi bir çözüm bir dizi kullanmak ve geçerli dizini iletiler dizisi uzunluğuna göre modüllemektir. Bu, geçiş yapmak için daha fazla öğe eklemeyi çok daha kolaylaştırır ve durum sayaçta örtülü olduğundan kodun anlaşılması daha kolaydır.

const sleep = ms => new Promise(res => setInterval(res, ms));

(async () => {
  const messages = ["hi", "bye"];
  
  for (let i = 0; i < 10; i++) {
    console.log(messages[i%messages.length]);
    await sleep(1000);
  }
})();

setInterval() tarafından durdurulur clearInterval() değil clearTimeout(). Ayrıntılar aşağıdaki kodda yorumlanmıştır.

// Define a counter
let i = 0;
// Define interval function
const fnCount = setInterval(fnSwitch, 1000);

function fnSwitch() {
  // Increment counter
  i++;
  // if counter / 2 is 0 log 'HI'
  if (i % 2 === 0) {
    console.log(i + ' HI');
    // Otherwise log 'BYE'
  } else {
    console.log(i + ' BYE');
  }
  // If counter is 10 or greater run fnStop()
  if (i >= 10) {
    fnStop();
  }
};

function fnStop() {
  // Stop the interval function fnCount()
  clearInterval(fnCount);
};