Why my reusable function don't work, I do the logic without the variables and the function run correctly

Question

I'm new in code in general, I'm learning javascript, some days ago I make a "Path Checker", just for look what Can I do with my current knowledge, now 1 week later I'm try to improve it, less code, more reusable functions, but I don't know why Don't run correctly, the logic it's good alone, but with the variables dont' work.

This is the basic logic.

let moto1='';

function checkMoto1() {
    if (myMotosInTheGarage === 0 && moto1 === '') {
        openAlert(displaySorryAlert); //global function that works
    } else if (myMotosInTheGarage === 0 && moto1 === 'out') {
        moto1 = 'return';    //change status
        myMotosInTheGarage++; //sum to a count
        countMotos; //const of write the myMotosInTheGarage in a textContent
        changeBackground(btn1, 'red'//global function that works
    } else if (myMotosInTheGarage >= 0) {
        if (moto1 === '') {
            moto1 = 'out';
            myMotosInTheGarage--;
            countMotos;
            changeBackground(btn1, 'green');
        } else if (moto1 === 'out') {
            moto1 = 'return';
            myMotosInTheGarage++;
            countMotos;
            changeBackground(btn1, 'red');
        }
    }
}

And I try this to a global function.

let moto1='';

function checkMoto1() {
    checkMotoGarage(moto1, btn1);
};

function checkMotoGarage(motonumber, btnnumber) {
    if (myMotosInTheGarage === 0 && motonumber === '') {
        openAlert(displaySorryAlert);
    } else if (myMotosInTheGarage === 0 && motonumber === 'out') {
        motonumber = 'return';
        myMotosInTheGarage++;
        countMotos;
        changeBackground(btnnumber, 'red');
        console.log(`the ${btnnumber} it's ${motonumber}`);
    } else if (myMotosInTheGarage >= 0) {
        if (motonumber === '') {
            motonumber = 'out';
            myMotosInTheGarage--;
            countMotos;
            changeBackground(btnnumber, 'green');
            console.log(`the ${btnnumber} it's ${motonumber}`);
        } else if (motonumber === 'out') {
            motonumber = 'return';
            myMotosInTheGarage++;
            countMotos;
            changeBackground(btnnumber, 'red');
            console.log(`the ${btnnumber} it's ${motonumber}`);
        }
    }
};

The moto status don't change in the global function, Why is that? What I did wrong?.

What specifically do you mean by *"The moto status don't change in the global function"*? — David, Aug 19 '21 at 18:39
hi, thanks for the help, I mean in the reusable function, 'moto1' should change in the click, from empty quotes to 'out', since this first step it's not working all the logic don't run correctly. — John McKrazy, Aug 19 '21 at 18:47

score 0 · Answer 1 · answered Aug 19 '21 at 18:49

0

Nowhere in the updated version of the code does this variable ever change:

let moto1='';

In the original working version the code updates that variable:

moto1 = 'return';

But in the new version you're only updating the local variable in that function, not the global variable:

motonumber = 'return';

If you want to maintain and update a global variable, you'll need to update that:

moto1 = 'return';

Alternatively you can return the value from the function (just remember to do everything else you need to do before returning) and assign/use the value wherever you call the function. But the function is already modifying other global variables so you may as well remain consistent with the patterns you're using.

answered Aug 19 '21 at 18:49

David

208,112
36
198
279

OK I see my mistake now, but I thought that puting the local variable change the global, Thanks alote. – John McKrazy Aug 19 '21 at 19:21
Coul'd you expand the process so that it understands it better, it does not necessarily have to be with what I am doing, simply with an example that shows me how to change from the global variable to the local one – John McKrazy Aug 19 '21 at 19:46
@JohnMcKrazy: You don't "change from the global variable to the local one". *Variables* aren't passed to functions, *values* are. The function has a local variable to refer to that value. Re-assigning that local variable to refer to a different value doesn't change anything except what value that variable points to. – David Aug 19 '21 at 19:48
yes, that I understand now, but how do that? just a little visual example if you coul'd – John McKrazy Aug 19 '21 at 20:31
@JohnMcKrazy: How to do *what*, exactly? So far you're just asking how to assign a value to a variable. Which is something that (1) your code already does in several places and (2) this answer already demonstrates. It's not clear what you're asking. – David Aug 19 '21 at 20:33
yes, maybe I don't be very clear,sorry and thanks for your time. – John McKrazy Aug 19 '21 at 20:39

score 0 · Answer 2 · answered Aug 19 '21 at 22:44

I got it, you need to return a value, not a variable, and then change the variable with the new value outside the reusable function. I badly think you Can somehow change the value inside the reusable function, that whats my question, becouse in this case, you only Can have just one value of this function every time?, how to change the value inside instead? It's possible?

function checkMoto1() {
    moto1 = ckeckMotoGarage(moto1, btn1);
    console.log(moto1);
}
function ckeckMotoGarage(motoNumber, btnNumber) {
    if (myMotosInTheGarage >= 0 && motoNumber === '') {
        btnNumber.style.background = 'green';
        btn1.style.borderColor = 'green';
        return 'out';
    } else if (myMotosInTheGarage >= 0 && motoNumber === 'out') {
        btnNumber.style.background = 'red';
        btn1.style.borderColor = 'red';
        return 'return';
    }
}

Why my reusable function don't work, I do the logic without the variables and the function run correctly

2 Answers2