JavaScript Number Count Program

// This is a number counter game, you can increase or decrease, you also have a super OP autoclicker which you can enable.
// Here we have our variables
const countLabel = document.getElementById("countLabel"); //We are getting the elements from the HTML file that is linked to this javascript file, so we know which document it is.
const increaseBtn = document.getElementById("Increase"); // We are just getting elements, nothing more to say.
const decreaseBtn = document.getElementById("Decrease");
const resetBtn = document.getElementById("Reset");
const acBtn = document.getElementById("Autoclick");
const disableACBtn = document.getElementById("Disable_Autoclicker");

let currentCount = 0; // 'let' is a variable keyword, it can be declared only once, but it's value can be changed. Unlike for 'const', it's impossible.
let autoclickEnabled = false; // In JavaScript, we have 4 data types, from what I can remember, number, string, boolean, and null.
let autoclickMiliSpeed = 1

async function checkCounter(isNegative) { // A function is a reusable block of code, we need to know if it's negative so we can make the background red, which is a form of achievement.
    // You may notice it says 'async', it's optional, but it means 'asynchronous', which means it won't distrupt the normal flow of the website, and won't wait until it's finished.
    if (isNegative == false) { // It can explain itself.
        if (currentCount >= 100000) { // Here it says '>=', it's a logical operator that returns true or false, there are many, but == means equals to, and >= means bigger than or equals, and etc.
            document.body.style.backgroundColor = "tomato"; // Like I said, self-explanatory.
        } else {
            document.body.style.backgroundColor = "white";
        }
    } else if (isNegative == true) {
        if (currentCount <= -100000) { // We are allowing the user to reach negative points.
            document.body.style.backgroundColor = "tomato";
        } else {
            document.body.style.backgroundColor = "white";
        }
    }
}

increaseBtn.addEventListener("click", function() { // We are listening to when something happens, similarly to Roblox LUAU events, we can provide what type of event we are listening to, for this one is 'click', the second argument is what you want to do when it happens.
    if (autoclickEnabled) { // So am I the only one that doesn't use arrow functions?
        const intervalId = setInterval(() => { // Repeat something after a certain amount of time, we made it a variable so we can make changes to it, like clearing it.
        if (!autoclickEnabled) { // the ! means 'if not'
            clearInterval(intervalId); // Stop the loop.
        } else {
            currentCount++; // ++ means increment, and increment 1 only, same with --, to increment more than 1, just type _ + _
            countLabel.textContent = currentCount; // It automatically gets converted to a string, so how is TypeScript doing in that kind of matter?
            checkCounter(false); // We gave it false because it requires a parameter, that the function then uses, we are checking if it's negative, but we are incrementing, so it's false.
        }
    }, autoclickMiliSpeed);
    } else {
        currentCount++;
        countLabel.textContent = currentCount;
        checkCounter(false);
    }
})

decreaseBtn.addEventListener("click", function() { // Literally the same thing.
    if (autoclickEnabled) {
        const intervalId = setInterval(() => {
        if (!autoclickEnabled) {
            clearInterval(intervalId);
        } else {
            currentCount--; // But here is different.
            countLabel.textContent = currentCount;
            checkCounter(true); // Now it's actually negative this time, just in case it's below 0.
        }
    }, autoclickMiliSpeed);
    } else {
        currentCount--;
        countLabel.textContent = currentCount;
        checkCounter(true);
    }
})

resetBtn.addEventListener("click", function() {
    document.body.style.backgroundColor = "white"; // Resets everything.
    currentCount = 0;
    countLabel.textContent = 0;
})

acBtn.addEventListener("click", function() {
    autoclickEnabled = true; // If it's true, we can more easily allow the user to increment/decrement at their freedom, just by clicking on that button.
})

disableACBtn.addEventListener("click", function() {
    autoclickEnabled = false;
})

// I'm not adding any back-end code examples, but I'm kind of interested in express.js.