CODEWITHSUNDEEP
javascriptvariables
Siro
Siro

Reputation: 57

Javascript is saving wrong variables

I'm trying to make a dynamic object that is saving a title and a score from HTML page after the object is done I'm saving it into an array to make it easier for later.

I have a problem when I'm assigning object into array like this:

for (let j = 0; j < array.length; j++) {
    for (let i = 0; i < 6; i++) {
                                /*getting result as a number from HTML page (example: 8/10, result = 8)*/
        if (j == 0) {
            result += Number(score[i].innerHTML.replace('/10', ''));
        } else {
            result += Number(score[i + (x * j)].innerHTML.replace('/10', ''));
    }

          /*making result on 1 decimal place (example = 9.2)*/
result = (Math.round((result / 6) *10)) / 10;

objNum.result = result;
objNum.title = title[j].innerHTML;
scoreNum[j] = objNum;

console.log(objNum);           /*returns objects with correctly assigned values each time, it displays the right thing*/
}

After the loop is done:

    console.log(scoreNum); 
/*returns: */
    
[{
    title: "The Rising of the Shield hero",
    result: 8.5
}], [{
    title: "The Rising of the Shield hero",
    result: 8.5
}], [{
    title: "The Rising of the Shield hero",
    result: 8.5
}], [{
    title: "The Rising of the Shield hero",
    result: 8.5
}], [{
    title: "The Rising of the Shield hero",
    result: 8.5
}], [{
    title: "The Rising of the Shield hero",
    result: 8.5
}], [{
    title: "The Rising of the Shield hero",
    result: 8.5
}]

What it is supposed to return:

    [{
        title: "Nanatsu no taizai (7 deadly sins)",
        result: 9.2
    }], [{
        title: "One punch man",
        result: 8.8
    }], [{
        title: "No Game No Life",
        result: 9.7
    }], [{
        title: "Darling in the FranXX",
        result: 8.2
    }], [{
        title: "Sword Art Online",
        result: 7.7
    }], [{
        title: "Demon king academy",
        result: 9.0
    }], [{
        title: "The Rising of the Shield hero",
        result: 8.5
    }]

When I call out objNum in loop id displays the right thing, but when I want to assign it into an array because it will be much easier to work with, it assigns the last thing into all slots in array.

Thanks, Siro

Edit

After adding a line of code on the end of the loop:

objNum = {title: "", result: 0}

It still didn't work, so I've restarted a PC and suddenly it worked.

Upvotes: 0

Views: 57

Answers (1)

trincot
trincot

Reputation: 350771

You only use one object objNum. All you do is change its properties in the loop, but that is still the same object. So you end up referencing that same object multiple times in your scoreNum array.

Instead, create a new object in each iteration, and store that object in your array.

Change:

objNum.result = result;
objNum.title = title[j].innerHTML;
scoreNum[j] = objNum;

To:

scoreNum[j] = { // create a new object on the spot
    result,
    title: title[j].innerHTML
};

Follow up

In the later edit to your question you do create a new object with:

objNum = {title: "", result: 0}

So if that statement is placed within the loop, the problem no longer occurs.

NB: rebooting your PC has no effect on how this runs.

Upvotes: 1

Related Questions