I have the following logic that is scalable to only a certain degree in other words I have to write the logic manually for each case when a certain threshold has been reached current and biggest issue is I have a reference to only one item (thisCase) that gets increased each render.
any idea how to be able to se certain dynamic increment without having to write it manually for each case , this function is a utility function btw.
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>
Here is my go at it, I think it works pretty well for your problem if I understood it right.
Note : I see in the comments in your post that you incremented by 1, my script is incremented by 4 for demo purpose but you can change that value and also the "step" value (= 8 in your problem)
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>
In this, you simply divide the thisCase by 8 as follows
let increment = (thisCase) => {
let i=Math.floor(thisCase/8)+1;
return i*8;
};