Tengo la siguiente lógica que es escalable solo hasta cierto punto, en otras palabras, tengo que escribir la lógica manualmente para cada caso cuando se ha alcanzado un cierto umbral actual y el mayor problema es que tengo una referencia a solo un elemento (este caso) que se incrementa cada renderizado.
alguna idea de cómo poder ver cierto incremento dinámico sin tener que escribirlo manualmente para cada caso, esta función es una función de utilidad por cierto.
let thisCase = 1 // this case increase after render const increment = () => { const incementThisCase = () => { console.log(thisCase + 1) thisCase = thisCase +1 } incementThisCase() if (thisCase > 8 && thisCase < 16) { alert(8) } if (thisCase > 16 && thisCase < 24) { alert(16) } if (thisCase > 24 && thisCase < 32) { alert(32) } }; <div onclick={increment()}>incrment</div>Aquí está mi intento, creo que funciona bastante bien para su problema si lo entendí bien.
Nota: veo en los comentarios de su publicación que aumentó en 1, mi secuencia de comandos se incrementa en 4 con fines de demostración, pero puede cambiar ese valor y también el valor de "paso" (= 8 en su problema)
var thisCase = 0; var step = 8; function increment(){ var currentStep = step; thisCase = thisCase + 4; console.log('ThisCase = ' + thisCase); // testing logic while(thisCase > currentStep){ const max = parseInt(currentStep)+parseInt(step); if(thisCase < max){ alert(thisCase + ' is between ' + currentStep + ' and ' + max); return; } else currentStep += step; } }; <button onclick="increment()">Increment</button>En esto, simplemente divides el thisCase por 8 de la siguiente manera
let increment = (thisCase) => { let i=Math.floor(thisCase/8)+1; return i*8; };